knockout.js Foreach

示例

与其他语言中使用的中继器相似。通过此绑定，您可以为数组中的每个项目复制html块。

<div data-bind="foreach:contacts">
    <div class="contact">
        <h2 data-bind="text:name">
        <p data-bind="text:info">
    </div>
</div>
 
<script type="text/javascript">
    var contactViewModel = function (data) {
       this.name= ko.observable(data.name);
       this.info= ko.observable(data.info);
    };

    ko.applyBindings({
        contacts: [
            new contactViewModel({name:'Erik', info:'Erik@gmail.com'}),
            new contactViewModel({name:'Audrey', info:'Audrey@gmail.com'})
        ]
    });
</script>

请注意，当我们遍历上下文时，它成为数组中的项，在本例中为的实例contactViewModel。在一个范围内，foreach我们还可以访问

• $parent -创建此绑定的视图模型

• $root -根视图模型（也可以是父视图模型）

• $data -数组此索引处的数据

• $index -渲染项的（可观察的）从零开始的索引