knockoutjs四 foreach的绑定

今天要讲的是foreach绑定

 <tbody data-bind="foreach:people">        <tr>            <td data-bind="text:$index()+1"></td>            <td data-bind="text:firstName"></td>            <td data-bind="text:lastName"></td>        </tr>        </tbody><script> function Model() {        var self = this;        self.people = ko.observableArray([            {firstName: 'Bert', lastName: 'Bertington'},            {firstName: 'Charles', lastName: 'Charlesforth'},            {firstName: 'Denise', lastName: 'Dentiste'}        ]);        self.remove = function (data,target) {            self.people.remove(this);        };    }    var model = new Model();    ko.applyBindings(model);</script>   

foreach 绑定需要绑定一个数组对象，foreach中的元素就会循环出现，
再看看下面的例子：

        <tr>            <td data-bind="text:$index()+1"></td>            <td data-bind="text:$data.firstName"></td>            <td data-bind="text:$data.lastName"></td>            <td><a data-bind="click:$parent.remove "  href='#' class="text-warning">删除</a></td>        </tr>

$index代表的是绑定的数组的元素的当前索引，$data代表的是当前循环到的对象，$parent代表的是当前对象的父对象，当前对象是people，父对象是model所以$parent.remove代表的是
model中的remove方法，这方法有两个参数：data，target。data对应的是当前对象绑定的数据，比如这个绑定中的data如图：

target.currentTarget对应的绑定这个方法的对象，当前的例子中如图：

当然，也可以像jstl中一样取一个别名给当前对象

    <tbody data-bind="foreach:{data:people , as :'p'}">        <tr>            <td data-bind="text:$index()+1"></td>            <td data-bind="text:p.firstName"></td>            <td data-bind="text:p.lastName"></td>            <td><a data-bind="click:$parent.remove " href='#' class="text-warning">删除</a></td>        </tr>    </tbody>

今天的例子就到这里，比较简单，代码托管在https://github.com/lushunming/knockoutJSDemo.git可以直接克隆。希望大家有意见可以留言，有疑问或者错误可以加我的qq1357197829和我交流