DativeJs {{#each}} block

The each block in dativejs is used to iterate array|object

In the Formal Versions Of Dativejs

It Was Hard to Achieve This

So We Made this to be a betterment for that :)

Usage

<div>
  {{#each foods as food}}
      <li>{{food}}</li>
  {{/each}}
</div>

each/each.dative.js

import Template from './each/each.dative.html'
export let Each = Dative.extend({
   el: "#app",
   data(){
      return {
        foods: ["Rice","Noodles","Vegetables"]
      };
   },
   template: Template
})

You Can Also Catch the Index number of each array

<div>
  {{#each foods as i,food}}
      <li>{{i}}:{{food}}</li>
  {{/each}}
</div>

NOTE When Using the #each block with object the i in the #each block will not be index again we are working on that

Don't Do This You'll Get A Messy Error

<div>
  {{#each foods as food}}
      <li>Type: {{food.type}}</li>
      <li>Name: {{food.name}}</li>
  {{/each}}
</div>

each/each.dative.js

import Template from './each/each.dative.html'
export let Each = Dative.extend({
   el: "#app",
   data(){
      return {
        foods: {
           type: "Fruit",
           name: "Guava"
        }
      };
   },
   template: Template
})

Do This

<div>
  <!-- `i` will give you the key here not the index -->
  {{#each foods as i,food}}
      <li>{{i}}:{{food}}</li>
  {{/each}}
</div>

Thanks For Reading

You Want to Test DativeJs Online

You Can Hit the Follow button on twitter i really appreciate
My Twitter Profile

Thanks Once Again For Reading and Supporting Me