Adding persistent data to applications - Build Windows 8 Apps with HTML5 and JavaScript - page 256

Next, you give this function at least a fake body:
TodoList.populateTaskList = function () {
var tasks = [
{ description: "Task #1" },
{ description: "Task #2" },
{ description: "Task #3" }
];
var bindingList = new WinJS.Binding.List(tasks);
var listview = document.getElementById("task-listview").winControl;
listview.itemDataSource = bindingList.dataSource;
listview.itemTemplate = document.getElementById("task-listitem");
}
The method takes a static array of objects with the property name description and binds it to the
ListView you previously added to the default.html page. The property named description is key here
since it is the property referenced by the list item template. In the amended default.html page, you
should have markup such as what is shown below—which is used to render any data item bound to
the ListView :
<div id="task-listitem" data-win-control="WinJS.Binding.Template">
<div class="listitem"><span data-win-bind="innerText: description"></span></div>
</div>
Figure 10-10 provides the current state-of-the-art TodoList application.
FIGURE 10-10 A list view populated with fake tasks.