knockoutjs : 계산 된 사항을 순서대로 관찰 할 수 있습니까?

Question

계산 된 관찰 가능 함수에서 관찰 가능 항목의 순서로 인해 업데이트되지 않는 계산 된 관찰 가능 항목이 있습니다. 분기를 클릭하면 리프에 계산 된 관찰 가능 항목이 업데이트되지 않습니다. 이것은 의도 된 것입니까?

https://jsfiddle.net/acL3f1qp/9/

자바 스크립트 :

(function() { 

    function Branch(viewModel) { 
    var self = this; 
    self.isAllowed; 
    self.isChecked = ko.observable(); 
    self.isChecked.subscribe(function(newValue){ 
     //is updating? 
     null; 
    }); 
    self.leaves = []; 
    self.allowLeaves = ko.computed(function() { 
     return viewModel.allowLeaves() && (!self.isAllowed || self.isChecked()); 
    }); 
    } 

    function Leaf(branch) { 
    var self = this; 
    var isCheckedInternal = ko.observable(); 
    self.isAllowed; 
    self.isChecked = ko.computed({ 
      read: function() { 
      return branch.allowLeaves() && isCheckedInternal(); 
      }, 
     write: function(value) { 
      isCheckedInternal(value); 
     } 
    }); 
    } 

    function ViewModel() { 
    var self = this; 
    var branch; 
    var leaf; 
    self.allowLeaves = ko.observable(true); 
    self.branches = []; 
    branch = new Branch(self); 
    branch.isAllowed = true; 
    branch.isChecked(true); 
    leaf = new Leaf(branch); 
    leaf.isAllowed = true; 
    leaf.isChecked(true); 
    branch.leaves.push(leaf); 
    self.branches.push(branch); 
    } 

    ko.applyBindings(new ViewModel()); 

})(); 

HTML :

<div> 
    <label> 
    <input type="checkbox" data-bind="checked: allowLeaves" /> 
    <span>allow leaves</span> 
    </label> 
</div> 
<div class="indent" data-bind="foreach: branches"> 
    <div> 
    <label> 
     <input type="checkbox" data-bind="checked: isChecked, visible: isAllowed" /> 
     <span>branch</span> 
    </label> 
    </div> 
    <div class="indent" data-bind="foreach: leaves"> 
    <div> 
     <label> 
     <input type="checkbox" data-bind="checked: isChecked, visible: isAllowed" /> 
     <span>leaf</span> 
     </label> 
    </div> 
    </div> 
</div> 
<br /> 
clicking on "branch" does 

가 잎에 계산 업데이트하지!

Answer 1

산출 된 관측 대상의 순서는 건물 dependencies까지입니다. 에서

이 계산 :

이

ko.pureComputed(function(){ 
    return a() && b(); 
} 

(a 및 b는 관측 가정 복귀 중 true 또는 false)

만약 && 운영자가 게으른이기 때문에 다음 b가 (평가되지는 false 반환) 및 KO는 에만 b에 종속성을 생성하지 않습니다.

이것은 좋은 일입니다. b에 대한 변경 사항은이 계산 값에 아무런 영향을 미치지 않으므로 재평가는 자원 낭비가 될 수 있습니다.

a 만약이 가치 b이 가지고 다음 종속성을 만들 것입니다 무엇을 찾아야합니다 그렇게 (이 a에 종속성을 가지고 있기 때문에) KO는 계산 재평가됩니다 true 반환하도록 업데이트됩니다.

당신의 바이올린에 관해서는

---

는 - 지금까지의 내가 볼 수있는 문제는 분기에 isChecked 관찰이 계산 된 allowLeaves에 어떤 식 으로든 연결되지 않는다는 점이다. 따라서 업데이트되지 않습니다. 이 같은 isCheckedInternal 더 Leaf처럼 당신에게 Branch의 구현을 변경하는 경우

는 :

function Branch(viewModel) { 
    var self = this; 
    self.isAllowed = ko.observable(); 
    var isCheckedInternal = ko.observable(); 

    self.leaves = []; 
    self.allowLeaves = ko.pureComputed({ 
    read: function() { 
     return viewModel.allowLeaves() && isCheckedInternal(); 
    }, 
    write: function(val){ 
     isCheckedInternal(val); 
    }}); 
} 

을하고는 allowLeaves에 확인 결합 후 예상대로 작동하도록 나타납니다. 당신이 테스트를 할 경우 self.allowBranch이 정의되지 않도록

나는, 노력하고 있습니다 fiddle ...