0

私はこのようなjsonコレクションを持っています

0: {FamilyDetailId:1, Name:ダニエル, 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リストの例で各コレクションを表示することです:

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

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

ノックアウトjsでこれを達成する方法は?

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ように、バインディングを 1 レベル上に移動するだけです。<ul>

JS :

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

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

HTML :

 <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

それぞれが異なる要素<ul>にバインドされていることを強調するために、所有者属性を追加しました。JSFiddle の例$dataを参照してください

于 2013-09-29T06:14:24.803 に答える