Knockout.js動的に作成可能なテーブル

Question

ノックアウトjsで「ダイナミックテーブル」を作成しようとしていますが、少し難しかったです。私は変数列のネストされたテンプレートを持つ "共通行テンプレート"を持っています。このような何か：

<script type="text/x-jquery-tmpl" id="CommonRow"> 
<td><input type="text" data-bind="value: Nome" /></td> 
<td data-bind="template: { name: $item.LabelOne + 'Row' }"></td> 
<td><button class="fancybox edit" data-bind="click: Edit">Modifica</button></td> 
<td><button class="remove" data-bind="click: Remove">Rimuovi</button></td> 
</script> 

だから、二<td>は次のようになりますテンプレート、レンダリングされます：

<script type="text/x-jquery-tmpl" id="ScalaRow"> 
<td><input type="text" data-bind="value: PianiFuoriTerra" /></td> 
<td><input type="text" data-bind="value: Foo" /></td> 
</script> 

この「作品」が、それは大きな問題があります。希望<td>がで入れ子になっていますテンプレートバインディングを持つ外部<td>、ヘッダーとの不適切な位置合わせを引き起こします（同様に構造化されています）。

<td>のラッピングを避けるために{{tmpl}}構文を試してみましたが、これは正しいhtmlを取得しますが、すべてのデータバインディングと観測可能な部分は動的部分ではもう機能しません。

<td>のブロックをレンダリングして、ノックアウト観測可能な機能を保持し、ラッピングタグを回避する方法はありますか？ありがとう。

Answer 1

あなたの最善の選択肢は、KO 1.3 betaを見ることです。ここであなたが望むような何かを行うためのサンプルです：http://jsfiddle.net/rniemeyer/wmDfv/

<table data-bind="foreach: items"> 
    <tr> 
     <td data-bind="text: name"></td> 
     <!-- ko template: type --> 
     <!-- /ko --> 
    </tr> 
</table> 

<script id="typeA" type="text/html"> 
    <td>typeA template</td> 
</script> 

<script id="typeB" type="text/html"> 
    <td>typeB template</td> 
</script>