0

我有这样的 json 集合

0: {FamilyDetailId:1, 姓名:Daniel, GenderId:1, Dob:/Date(1375554600000)/,…}

1: {FamilyDetailId:3, Name:Askar, GenderId:1, Dob:/Date(1375554600000)/,…}

    var employeeFamilyModel;
function bindModel(data) {
     employeeFamilyModel = ko.mapping.fromJS(data);
    ko.applyBindings(employeeFamilyModel, document.getElementById("collapseOne"));
}



 function loadData (employeeGuid) {
    $.ajax({
        url: "/HumanResource/EmployeeProfile/EmployeeProfileFamily?employeeGuid=" + employeeGuid,
        type: 'post',
        contentType: 'application/json',
        success: function (result) {
            bindModel(result);
        }
    });

};

看法

 <ul data-bind="foreach: employeeFamilyModel">
    <li data-bind="text: Name"></li>
 </ul>

我的问题是在新的 UL 列表 ex 中显示每个集合：

    <ul>
    <li> Name: Daniel </li>
</ul>

<ul>
    <li> Name: Askar </li>
</ul>

如何在 knockoutjs 中实现这一点？

4

2 回答 2

1

ko foreach 块中的所有内容都将像 foreach 循环一样重复。你在 ko 文本中的所有内容都只会输出而没有任何元素。

<!-- ko foreach: employeeFamilyModel -->
<ul>

   <li>Name: <!--ko text: Name--><!--/ko--></li>
</ul>
<!-- /ko -->
于 2013-09-28T18:22:09.527 回答
0

详细地说，您只需将foreach绑定“向上”移动一个级别，以便<ul>在视图模型中包含每个数据元素。

JS：

employeeFamily =  ko.observableArray([{Name: 'John Doe', Owner: 'John'},
                                  {Name: 'Jane Doe', Owner: 'Jane'}])

ko.applyBindings(employeeFamily, document.getElementById("collapseOne"));

网页：

 <div  id = 'collapseOne' data-bind="foreach: employeeFamily">

   <label data-bind="text: 'This list belongs to ' + $data.Owner"></label>
   <ul>
     <li data-bind="text: $data.Name"></li>
   </ul>
 </div>

结果：

This list belongs to John
  John Doe
This list belongs to Jane
  Jane Doe

我添加了 owner 属性来强调每个<ul>都绑定到不同的$data元素。请参阅JSFiddle 示例

于 2013-09-29T06:14:24.803 回答