Question

我可以创建一个包含多行的模板，不需要用tbody元素包裹吗？我无法使用tbody，因为它会重置我拥有的任何rowpan元素。

这是我到目前为止所拥有的：

＆＃13;

ko.applyBindings();

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>

<script type="text/html" id="template1">
  <tr>
    <td>Hello</td>
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
  </tr>
  <tr>
    <td>World</td>
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
  </tr>
</script>

<table>
  <tr>
    <td rowspan='3'>Menu</td>
    <th>Header</th>
    <td>one</td>
    <td>two</td>
    <td>three</td>
    <td>four</td>
  </tr>
 <tr data-bind="template: { name: 'template1'}"></tr>
</table>

＆＃13;

Answer 1

无容器绑定就是答案。

而不是：

<tr data-bind="template: { name: 'template1'}"></tr>

我需要：

<!-- ko template: { name: 'template1'}--><!-- /ko -->

Answer 2

如果只在DOM中的一个地方使用，不需要模板;你可以直接在你迭代行的地方做到这一点：

＆＃13;

var ViewModel = function() {
  var self = this;
  self.entries = [{
    name: "one",
    type: 'file'
  }, {
    name: "two",
    type: 'folder'
  }, {
    name: "three",
    type: 'file'
  }];

};

ko.applyBindings(new ViewModel());

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<table>
  <tbody data-bind="foreach: entries">
    <tr>
      <td> <span data-bind="text: name"></span>

      </td>
    </tr>
  </tbody>
</table>

＆＃13;

跨越多行的模板

2 个答案: