淘汰賽：在相同的HTML模板實例化元素

Question

由於具有以下結構的視圖模型：

- Root 
    - Rows [] 
     - Record 
     - Values[] 
      - Source 
      - Target 

我希望把這個表是這樣的：

<table> 
<thead> 
    <tr><th>#</th><th>Source</th><th>Target</th></tr> 
</thead> 
<tbody data-bind="foreach: Rows"> 
    <tr> 
     <td data-bind="text: Record"></td> 
     <td colspan="2"></td> 
    </tr> 

    <tr> 
     <!--- This row should repeat for every item in 'Values' ---> 
     <td>&nbsp;</td> 
     <td data-bind="text:Source"></td> 
     <td data-bind="text:Target"></td> 
    </tr> 
</tbody> 
</table> 

這是可能的淘汰賽？如果不是，我的替代品是什麼？我想將'Values'數組的值放在同一個表中，以確保列將正確調整表頭中的列。

Answer 1

您可以使用淘汰賽虛擬元素用foreach它綁定：

<table> 
    <thead> 
     <tr><th>#</th><th>Source</th><th>Target</th></tr> 
    </thead> 
    <tbody data-bind="foreach: Rows"> 
     <tr> 
      <td data-bind="text: Record"></td> 
      <td colspan="2"></td> 
     </tr> 

    <!-- ko foreach: Values --> 
     <tr> 
      <td>&nbsp;</td> 
      <td data-bind="text:Source"></td> 
      <td data-bind="text:Target"></td> 
     </tr> 
    <!-- /ko --> 
    </tbody> 
    </table> 

編號：Using text without a containing element