Show a List in a Template

  • page

To make an Array observable, pass it to can.List.

var people = new can.List([
    {firstname: "John", lastname: "Doe"},
    {firstname: "Emily", lastname: "Dickinson"}

var frag = can.view("app-template", {people: people})

To show a list of data within a mustache template, use the #each operator.

{{#each people}}
    {{lastname}}, {{firstname}}

Inside the #each block, the attributes are scoped to individual objects in the list of people.

To make changes to the list, use an Array method such as push or pop.

// adds a new person
people.push({firstname: "Paul", lastname: "Newman"})
// removes the last person