我使用knockoutjs绑定数据,我想在一个元素中附加数据绑定。
这是我的代码:
HTML:
<div id="wrapper">
<div data-bind="foreach: people">
<h3 data-bind="text: name"></h3>
<p>Credits: <span data-bind="text: credits"></span></p>
</div>
Javascript代码:
function getData(pageNumber)
{
//code get data
//binding
ko.applyBindings({ peopla: obj }, document.getElementById('wrapper'));
}
第一次pageNumber为1,然后我调用getData(1),我想在第2页显示更多数据我将调用getData(2),在第2页中数据将更多地显示在包装元素中追加到jquery。
如果我使用普通的jquery,我可以称之为
$("#wrapper").append(getData(2));
所以我不知道如何使用knockout在一个元素中绑定更多数据
答案 0 :(得分:0)
尝试以下脚本,这种模拟了如何通过替换现有数据或添加数据来将数据附加到阵列。希望它有所帮助
function myModel() {
var self = this;
self.people = ko.observableArray([{
name: 'Page 1 data',
credits: 'credits for page 1'
}]);
var i = 2;
self.getData = function () {
var returnedData = [{
name: 'Page ' + i + ' Name',
credits: 'credits for page ' + i
}];
self.people(returnedData);
i++;
}
self.getData2 = function () {
var returnedData = {
name: 'Page ' + i + ' Name',
credits: 'credits for page ' + i
};
self.people.push(returnedData);
i++;
}
}
ko.applyBindings(new myModel());
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<div id="wrapper">
<div data-bind="foreach: people">
<h3 data-bind="text: name"></h3>
<p>Credits: <span data-bind="text: credits"></span>
</p>
</div>
<button data-bind="click: getData">Simulate get data (Replaces current data)</button>
<button data-bind="click: getData2">Append to the same array (Adds to existing array)</button>