The control flow bindings are a special kind of bindings that affect a group of elements or other bindings instead of a single element. Also, control flow bindings support alternative syntaxes with comments such as the following (for example, changing parts marked with []
):
<!-- ko [binding-name]: [binding-value] --> [markup] <!-- /ko -->
Let's learn about these kinds of bindings through examples.
The
foreach
binding allows you to write a single markup that applies to each element in a collection of objects. It is very useful way to render lists and tables. Let's consider the following example (PersonalPage-Binding-Foreach1.html
):
The Model will be as follows:
var person = { children: [ { firstName: "Jonnie", age: 3 }, { firstName: "Jane", age: 5 }, { firstName: "Richard", age: 7}, { firstName: "Mary", age: 9} ] };
The ViewModel will be as follows:
var PersonViewModel = function() { var self = this; self.children =...