2013-08-05 5 views
2

녹아웃 js는 체크 박스를 표시하기 위해 데이터 배열에서 foreach를 수행하려고합니다. 내가 겪고있는 문제는 상자 중 하나와 상호 작용할 때까지는 체크 된 데이터 바인딩이 실행되지 않는 것입니다. 예를 들어 아래에 5 개의 텍스트 상자가 생성되고 있는데 그 중 아무 것도 체크 표시되지 않습니다. 그러나 "one"을 클릭하면 "two"와 "four"도 처음부터 확인해야합니다.넉 아웃 js 체크 박스 바인딩 확인

자바 스크립트 :

var viewModel = {}; 

viewModel.choices = ["one", "two", "three", "four", "five"]; 
viewModel.selectedChoices = ko.observableArray(["two", "four"]); 

viewModel.selectedChoicesDelimited = ko.dependentObservable(function() { 
     return viewModel.selectedChoices().join(","); 
    }); 

ko.applyBindings(viewModel); 

HTML : 당신의 도움에 대한 http://jsfiddle.net/bvGG3/1/

감사 :

<ul class="options" data-bind="foreach: choices"> 
    <li><label><input type="checkbox" name="NotifyMembers" data-bind="checked: $parent.selectedChoices, attr: { value: $data }" /><span data-bind="text: $data"></span></label></li> 
</ul> 
<hr /> 
<div data-bind="text: selectedChoicesDelimited"></div> 

바이올린이이다.

답변

11

버전 3.0 이전의 녹아웃에서는 바인딩이 순서대로 실행되었으므로, checked 바인딩이 attr 바인딩 전에 실행되는 것이 문제입니다.

<input type="checkbox" name="NotifyMembers" 
     data-bind="attr: { value: $data }, checked: $parent.selectedChoices" /> 

데모 JSFiddle :

그래서 당신은 당신의 바인딩의 순서를 변경해야합니다.

또는 3.0으로 업데이트하면 원래 코드가 작동합니다 (데모 JSFiddle).

관련 문제