错误消息:消息:无法读取 null 的属性“childNodes”
模板:(第 1 部分)
<tr>
<td><input type="text" data-bind="value: $data.Mark" /></td>
<td><input type="number" step="1" data-bind="value: $data.Quantity" /></td>
<td><input type="text" data-bind="value: $data.Description" /></td>
<td><input type="text" data-bind="value: $data.Type" /></td>
<td><input type="number" data-bind="value: $data.BaseLength" /></td>
<td><input type="number" data-bind="value: $data.TCXLNumber" /></td>
<td><input type="number" data-bind="value: $data.TCXLLength" /></td>
<td><input type="number" data-bind="value: $data.TCXRNumber" /></td>
<td><input type="number" data-bind="value: $data.TCXRLength" /></td>
<td><input type="number" data-bind="value: $data.SeatDepthLeft" /></td>
<td><input type="number" data-bind="value: $data.SeatDepthRight" /></td>
<td><input type="number" data-bind="value: $data.BCXCount" /></td>
<td><input type="number" data-bind="value: $data.Uplift" /></td>
<td data-bind="foreach: $data.Remarks">
<input type="text" data-bind="value: $data" />
</td>
<td><button class="w100 round alert deleteEntity">Delete</button></td>
</tr>
模板:(第 2 部分)
<tr>
<table>
<thead>
<tr>
<th colspan="3">LoadInfo</th>
<th colspan="2">Load1</th>
<th colspan="2">Load2</th>
<th rowspan="2"></th>
</tr>
<tr>
<th>Type</th>
<th>Category</th>
<th>Position</th>
<th>Value</th>
<th>Distance</th>
<th>Value</th>
<th>Distance</th>
</tr>
</thead>
<tbody data-bind="template: { name: 'LoadInfoTableTemplate', foreach: $data.LoadInfos }">
</tbody>
</table>
</tr>
查看:(原文)
<form>
<table class="grid">
<thead data-bind="template: { name: 'JoistsTableHeaderTemplate', with: $data[0] }"></thead>
<tbody data-bind="template: { name: 'JoistsTableBodyTemplate', foreach: $data }"></tbody>
</table>
</form>
视图:(修改)
<form>
<table class="grid">
<thead data-bind="template: { name: 'JoistsTableHeaderTemplate', with: $data[0] }"></thead>
<tbody data-bind="template: { name: 'JoistsTableBodyTemplate', foreach: $data }"></tbody>
</table>
<table data-bind="foreach: $data" style="display:none;">
<thead>
<tr>
<th colspan="3">LoadInfo</th>
<th colspan="2">Load1</th>
<th colspan="2">Load2</th>
<th rowspan="2"></th>
</tr>
<tr>
<th>Type</th>
<th>Category</th>
<th>Position</th>
<th>Value</th>
<th>Distance</th>
<th>Value</th>
<th>Distance</th>
</tr>
</thead>
<tbody data-bind="template: { name: 'LoadInfoTableTemplate', foreach: $data.LoadInfos }">
</tbody>
</table>
</form>
解释:
Template-Part-1 完美运行,并完美使用 Knockout 加载。如果在 Template-Part-1 工作之外完成 Template-Part-2(请参阅View: (Modified))。如果我将 a 附加<tr></tr>
到 Template-Part-1 并将 Template-Part-2 放在其中,<tr></tr>
则会给出错误消息。
简而言之,我试图将 Template-Part-2 中的表格嵌套在将附加到 Template-Part-1 的表格行中。这会引发上面的错误消息。但是,如果我将 Template-Part-2 放在自己的表中,放在表之后(并添加适当的 data-bind 属性),我希望将它嵌套进去,它可以完美地工作。
问题:有谁知道为什么试图嵌套我的表(模板-第 2 部分)会导致错误?我如何解决它?是否有一些淘汰规则不允许不需要绑定的东西被模板化?