привязка к фильтруемому объекту свойство нокаут вложенный 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> 

Я до сих пор не ясно, почему мне нужно, чтобы полностью определить grandKids собственность как vm.grandKids в UI связывания для маркированного списка.