Упрощенный нокаут вложенных петель

Question

Мой проект - создать сетку дат, основанную на моем представленииМодель ниже. Код работает, но мне интересно выяснить, есть ли более простой способ добраться до моего первого внутреннего массива «CalendarDateBlocks».

// data = products.productUnits.CalendarDateBlocks 
function productViewModel (data) { 
    var self = this; 
    window.viewModel = self; 
    self.productsList = ko.observable(data); 
} 

Нокаут HTML связывании В таблице

<table> 
    <tr> 
     <th>Product</th> 
     <th>Unit</th> 
     <!-- ko foreach: window.viewModel.productsList--> 
      <!-- ko if: ($index()===0)--> 
       <!-- ko foreach: ProductUnits --> 
       <!-- ko if: ($index()===0)--> 
        <!-- ko foreach: CalendarDateBlocks --> 
         <th data-bind="text: BlockDate"></th> 
        <!-- /ko --> 
       <!-- /ko --> 
       <!-- /ko --> 
      <!-- /ko --> 
     <!-- /ko --> 
    </tr> 
</table> 

JSon код с сервера

{ 
    "productsList":[ 
     { 
     "ProductId":1, 
     "Title":"Standard", 
     "ImageGalleryId":10, 
     "ProductUnits":[ 
      { 
       "ProductUnitId":1, 
       "ProductId":1, 
       "CalendarBlocks":[ 
        { 
        "ProductId":1, 
        "ProductUnitId":1, 
        "BlockDate":"09/01/2013" 
        }, 
        { 
        "ProductId":1, 
        "ProductUnitId":1, 
        "BlockDate":"09/02/2013" 
        } 
       ] 
      }, 
      { 
       "ProductUnitId":2, 
       "ProductId":1, 
       "CalendarBlocks":[ 
        { 
        "ProductId":0, 
        "ProductUnitId":0, 
        "BlockDate":"09/01/2013" 
        }, 
        { 
        "ProductId":0, 
        "ProductUnitId":0, 
        "BlockDate":"09/02/2013" 
        } 
       ] 
      }, 
      { 
       "ProductUnitId":3, 
       "ProductId":1, 
       "CalendarBlocks":[ 
        { 
        "ProductId":0, 
        "ProductUnitId":0, 
        "BlockDate":"09/01/2013" 
        }, 
        { 
        "ProductId":0, 
        "ProductUnitId":0, 
        "BlockDate":"09/02/2013" 
        } 
       ] 
      }, 
      { 
       "ProductUnitId":4, 
       "ProductId":1, 
       "CalendarBlocks":[ 
        { 
        "ProductId":0, 
        "ProductUnitId":0, 
        "BlockDate":"09/01/2013" 
        }, 
        { 
        "ProductId":0, 
        "ProductUnitId":0, 
        "BlockDate":"09/02/2013" 
        } 
       ] 
      } 
     ] 
     } 
    ] 
}; 

Answer 1

Это должно работать

<!-- ko foreach: window.viewModel.products.ProductUnits.CalendarDateBlocks --> 
    <th data-bind="text: BlockDate"></th> 
<!-- /ko -->