afterRender가 호출되지 않는 이유는 무엇입니까?

다음 샘플 HTML을 살펴보십시오. 간단한 KO foreach 바인딩과 observableArray에 새 항목을 추가하는 버튼입니다. 추가가 잘 작동하고 새 항목이 나타납니다. 그러나 afterRender 메서드는 호출되지 않습니다. 초기 바인딩 이후가 아니라 새 항목이 추가되고 렌더링 된 후에는 호출되지 않습니다. 왜?afterRender가 호출되지 않는 이유는 무엇입니까?

바이올린 : foreach 바인딩 중 하나를 배열하거나, 인수를 추가 이벤트를 지정할 객체를 가지고 있기 때문에http://jsfiddle.net/CQNm6

HTML

<html lang="en" xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
     <meta charset="utf-8" /> 
     <title></title> 
     <script type="text/javascript" src="http://knockoutjs.com/downloads/knockout-2.2.1.js"></script> 
    </head> 
    <body> 
     <div data-bind="foreach: data.things, afterRender: afterRenderTest"> 
      <h1 data-bind="text: name"></h1> 
     </div> 
     <a href="JavaScript:void(0);" onclick="data.things.push({ name: ko.observable('New Thing') });">Add New Thing</a> 

     <script type="text/javascript"> 
      var Thing = (function() 
      { 
       function Thing(p_name) 
       { 
        this.name = ko.observable(p_name); 
       } 

       return Thing; 
      })(); 
      var data = 
      { 
       things: ko.observableArray(
       [ 
        new Thing("Thing One"), 
        new Thing("Thing Two"), 
        new Thing("Thing Three") 
       ]) 
      }; 

      function afterRenderTest(elements) 
      { 
       alert("Rendered " + elements.length + " elements."); 
      } 

      ko.applyBindings(); 
     </script> 
    </body> 
</html>

출처

2013-04-16 Josh M.

귀하의 구문이 잘못되었습니다. documentaiton:

에서

는 반복 할 배열을 전달합니다. 바인딩은 각 항목에 대해 마크 업 섹션을 출력합니다.

또는 반복 할 어레이 인 data이라는 속성이있는 JavaScript 객체 리터럴을 전달하십시오. 객체 리터럴 도

그래서 당신이 쓰기 필요 ... 등 afterAdd 또는 includeDestroyed과 같은 다른 특성을 가질 수있다 :

<div data-bind="foreach: { data: data.things, afterRender: afterRenderTest }"> 
    <h1 data-bind="text: name"></h1> 
</div>

데모 JSFiddle.

출처

2013-04-16 20:00:16 nemesv

바보 나, 감사합니다! –

afterRender가 호출되지 않는 이유는 무엇입니까?

답변

관련 문제