jquery에 더 많은 데이터를 추가하는 것과 같은 방법이 있습니까?

Question

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> 

자바 스크립트 코드 : PAGENUMBER가 1 처음에

function getData(pageNumber) 
{ 
    //code get data 
    //binding 
    ko.applyBindings({ peopla: obj }, document.getElementById('wrapper')); 
} 

, 그때 GetData의 전화 (여기

내 코드입니다 1), 2 페이지에 더 많은 데이터를 표시하고 싶습니다. getData (2)를 호출하고, 2 페이지에서 데이터가 더 많이 표시되도록합니다 jquery에 append하는 것 같은 요소마다. 내가 그

$("#wrapper").append(getData(2)); 

과 같은 몇 가지를 호출 할 수 있습니다 내가 정상 jQuery를 사용하는 경우

그래서, 녹아웃

Answer 1

는 다음 스크립트를 시도 하나 elemnt에 더 많은 데이터 바인딩의 종류를 사용하는 방법을 모른다 기존 데이터를 대체하거나 추가하여 배열에 데이터를 추가하는 방법을 시뮬레이션합니다. 이

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>

도움이되기를 바랍니다