Knockout foreach嵌套表

我有點獨特的情況，我希望淘汰賽js提供了一種方法來實現這一點。Knockout foreach嵌套表

我有以下結構：

Order = function() { 
    var self = this; 
    self.Name = 'default'; 
} 

Customer = function() { 
    var self = this; 
    self.Name = 'default'; 
    self.Orders = []; 
}

我有如下表

<table> 
    <thead> 
     <tr> 
      <th>Customer Name</th> 
     </tr> 
    </thead> 
    <tbody data-bind="foreach: CustomerArray"> 
     <tr> 
      <td data-bind="text: Name"></td> 
     </tr> 
    </tbody> 
</table>

因此，這是偉大的，它給了我所有的客戶名稱的列表。

現在對於第二步，我必須以列出的方式對錶格進行格式化。訂單名稱，然後在底部客戶名稱：

Customer Name (TH LABEL) 
Order1 
Order2 
Order3 
Smith, Frank

我想出了通過包括每個客戶的迭代內TBODY築巢我的訂單陣列的想法，但我不喜歡，因爲列的寬度的這種方法從訂單到客戶將不會對齊，因爲它們是不同的表格。

有沒有人有任何好的方法來解決我的不尋常的問題？

謝謝！

來源

2013-05-20 mvcNewbie

你可以使用「無容器控制流語法」（Note 4 on the foreach docs）來呈現每個順序的TD，則客戶，而不含元素：

<table> 
    <thead> 
     <tr> 
      <th>Customer Name</th> 
     </tr> 
    </thead> 
    <tbody data-bind="foreach: CustomerArray"> 
     <!-- ko foreach: Orders --> 
     <tr> 
      <td data-bind="text: OrderDetails"></td> 
     </tr> 
     <!-- /ko --> 
     <tr> 
      <td data-bind="text: Name"></td> 
     </tr> 
    </tbody> 
</table>

註釋的塊創建的結合範圍，就像一個關於TBODY，但沒有包含元素。

來源

2013-05-20 17:02:28 kevingessner

令人驚歎......對你引用的文檔感到迷惑，對於我正在嘗試完成的內容來說，這不是一個更完美的選擇！ – mvcNewbie

這應該工作：

<table> 
    <thead> 
     <tr> 
      <th>Customer Name</th> 
     </tr> 
    </thead> 
    <tbody data-bind="foreach: CustomerArray"> 
     <!-- ko foreach: Orders --> 
     <tr> 
      <td data-bind="text: Name"></td> 
     </tr> 
     <!-- /ko --> 
     <tr> 
      <td data-bind="text: Name"></td> 
     </tr> 

    </tbody> 
</table>

我希望它能幫助。

來源

2013-05-20 17:02:33 Damien

Knockout foreach嵌套表

回答

相關問題