Data and Template Examples

---

Using data in templates with mustache syntax { { } }

This text is from a data variable: {{ message }}

This number is from a data variable: {{ number }}

The number of flowers with images on this page is {{ flowersInMN.length }}

The number is greater than 100

Looping over arrays

• {{ flower }}

Showing data from an object

The name of the flower is {{ flowerInfo.name }}. It is often the color {{ flowerInfo.color }}.

Some uses of {{ flowerInfo.name }} are {{ flowerInfo.uses }}.

The flower info object's name is {{ flowerInfo.name }}.

The flower info object's name is not Rose. Using a v-else is not required if you don't need it.

Looping over a list of objects

Flower	Minnesota native plant?
{{ flower.name }}	{{ flower.livesInMN }}

Looping over a list of objects - plus v-if and v-bind

Flower	Minnesota native plant?	Image
{{ flower.name }}	Yes! No