knockout.js數據綁定對象

的每個陣列我有JSON返回：knockout.js數據綁定對象

{ 
    "school": 
    { 
     "students":[{"firstName":"John", "lastName":"Doe"},"firstName":"Jane", "lastName":"Doe"}] 
    } 
}

然後在我的標記我有，因爲它是不工作

<ul data-bind="foreach: school.students"> 
    <li><span data-bind="text: firstName"></span><span data-bind="text: lastName"></span></li> 
</ul>

school.students一定是不對的。有人可以幫助我的語法？

來源

2017-05-25 DahlinDev

不知道如何更新的問題，因爲我李丟了......但基本上我有數據綁定：您是否使用「的foreach school.students」 – DahlinDev

映射插件？我們需要在這裏查看完整的上下文，瞭解如何創建視圖模型以及父HTML元素的任何綁定。 – JohnnyHK

基因敲除不起作用。您需要將JSON構建到某些對象中，然後才能對其綁定foreach。

例如，創建你需要的屬性學生對象：

function Student(firstName, lastName) { 
    this.firstName = ko.observable(firstName); 
    this.lastName = ko.observable(lastName); 
}

然後當你有你的JSON字符串（也許在你的AJAX負荷的成功回調），您可以創建這些集合從數據學生對象：

school.students = ko.utils.arrayMap(json, function(item) { 
    return new Student(item.firstName, item.lastName); 
});

然後，您可以使用foreach綁定，你在你的小例子已經完成。當然，我假設你已經創建了一個視圖模型並正確使用了ko.applyBindings()。

來源

2017-05-25 14:17:09 Drummad

他們有一個淘汰賽映射插件爲此。運行下面的代碼段。

var data = { 
 
    "school": { 
 
    "students": [{ 
 
     "firstName": "John", 
 
     "lastName": "Doe" 
 
    }, { 
 
     "firstName": "Jane", 
 
     "lastName": "Doe" 
 
    }] 
 
    } 
 
} 
 
var viewModel = ko.mapping.fromJS(data); 
 

 
$(document).ready(function() { 
 
    ko.applyBindings(viewModel); 
 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout.mapping/2.4.1/knockout.mapping.js"></script> 
 

 
<ul data-bind="foreach: school.students"> 
 
    <li><span data-bind="text: firstName"></span><span data-bind="text: lastName"></span></li> 
 
</ul>

http://knockoutjs.com/documentation/plugins-mapping.html

來源

2017-05-25 20:49:18

knockout.js數據綁定對象

回答

相關問題