フィルタリングされたオブジェクトのプロパティにバインドするノックアウトネストされたforeach

Question

$parent、$dataを理解しようとしていて、$parent値に基づいてオブジェクト配列をフィルタリングしようとしました。フィルタセットに要素を結合この種の問題に走った誰もが、については

<p>My kids:</p> 
    <ul data-bind="foreach: kids"> 
     <li> <span data-bind="text: $data" ></span>  
       <ul data-bind="foreach: grandKids.filter(function (obj) { return obj.mother === $parent })"> 
       <li><span data-bind="text: $data.name"></span></li>      
      </ul> 
     </li> 
     </ul> 


    <script src="Scripts/knockout-3.4.1.js"></script> 
    <script> 
     var vm = { 
      name : ko.observable("Anjan"), 
      age: ko.observable(40), 
      kids: ["Mira", "Teresa"], 
      grandKids: [ 
         { name: "Andy", mother: "Mira" }, 
         { name: "Alice", mother: "Mira" }, 
         { name: "Alex", mother: "Teresa" }, 
         { name: "Abby", mother: "Teresa" } 
         ] 
     }; 

Answer 1

、私はそれをやって、他の方法があると確信していますが、私はこれを解決する方法は、コンテナレスを使用していましたKO以下のように、結合：

<ul data-bind="foreach: kids"> 
       <li>       
        <span data-bind="text: $data.name" > </span> 
        <button data-bind="click: $parent.removeKid">Remove (moved out)</button> 
        <button data-bind="click: $root.addGrandKid" style="float:right;">Just had a baby</button> 

        <ul data-bind="foreach: vm.grandKids"> 
         <!--ko if: $parent.name() == $data.mother() --> 
          <li>      
           <!--ko $data.name() --><!-- /ko --> 

          </li> 
         <!-- /ko-->      
        </ul> 

        </li>    
      </ul> 

私はまだ、私は完全にUIが順不同リストのバインディングにvm.grandKidsとしてgrandKidsプロパティを修飾するために必要な理由としては不明です。