有什么方法可以在jquery中添加更多数据?

时间:2015-01-26 10:13:18

标签: javascript jquery knockout.js

我使用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在一个元素中绑定更多数据

1 个答案:

答案 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>