녹아웃 양방향 foreach 바인딩 DOM 변경 업데이트 모델

페이지에 목록이 있고 목록 항목을 표시하기 위해 knockout의 foreach 바인딩을 사용하는 경우 다른 항목이 DOM을 업데이트하여 추가 목록 항목을 추가합니다. 거기에 어떤 방식으로 DOM 변경 감지하고 해당 모델을 observableArray 새 항목을 추가하려면 업데이트 녹아웃 얻을 수 있습니까? 여기 녹아웃 양방향 foreach 바인딩 DOM 변경 업데이트 모델

문제를 보여줍니다 바이올린 ...

http://jsfiddle.net/BGdWN/1/

function MyViewModel() { 
    this.items = ko.observableArray([ 
     { name: 'Alpha' }, { name: 'Beta' }, { name: 'Gamma' }, { name: 'Delta' } 
    ]); 

    this.simpleShuffle = function() { 
     this.items.sort(function() { 
      return Math.random() - 0.5; // Random order 
     }); 
    }; 

    this.simpleAdd = function() { 
     $("#top").append("<li>New item</li>"); 
    } 
} 

ko.applyBindings(new MyViewModel());

이 같은 observableArray에 바인딩이 목록을 가지고는 addItem를 버튼을 클릭하고 DOM이 업데이트되는 것을 볼 수있다 상위 목록에 새 목록 항목을 포함하려면 두 번째 목록도 모두 모델을 통해 업데이트해야합니다.

knockout이 렌더링하지 않은 DOM 요소를 무시한 것처럼 보입니다. 셔플 버튼을 클릭하면이 부분을 볼 수 있습니다. 나는 그것을 제거하고 완전한 재 렌더링을 할 것으로 예상했을 것이다.

출처

2013-05-01 Dean North

** KO는이 기능을 지원하지 않으므로 "observableArray에 항목을 추가하기 만하면됩니다." 그렇지 않으면 아마도 DOM 변경 내용을 수신하고 관찰 가능 배열을 채우는 사용자 지정 바인딩 처리기를 작성할 수 있습니다 ....하지만 "그냥 observableArray에 항목 추가"라고 말합니다. – nemesv

다음 맞춤 바인딩을 작성해야합니다 :-( –

가 first link 봐 내가 희망 Interface MutationEvent

See Fiddle

$('#top').bind('DOMNodeInserted DOMNodeRemoved', function() { 
    alert('Changed'); 
});

가 도움이 두 번째 링크를 타고 "그냥 observableArray에 상품을 추가"로 대답하지 마십시오 .

출처

2013-05-01 16:37:11 Damien

녹아웃 양방향 foreach 바인딩 DOM 변경 업데이트 모델

답변

관련 문제