0

关于源绑定的文档有一个说明：

重要提示：绑定到数组时，应在模板中使用单个根元素。拥有两个第一级 DOM 元素将导致不稳定的行为。

但是，我发现即使对于非数组也是如此。

我有以下 HTML，它设置了两个由两个模板填充的 div。唯一的区别是工作模板将该数据绑定跨度包装在一个 div 中。

<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://cdn.kendostatic.com/2013.3.1119/js/kendo.all.min.js"></script>
<title>JS Bin</title>
  <script id="broken-template" type="text/x-kendo-template">
      Foo: <span data-bind="text: foo"></span><br/>
      Foo Again: <span data-bind="text: foo"></span>
  </script>
  <script id="working-template" type="text/x-kendo-template">
      <div>
            Foo: <span data-bind="text: foo"></span><br/>
            Foo Again: <span data-bind="text: foo"></span>
      </div>
  </script>
</head>
<body>
  <div id="broken-div" data-template="broken-template" data-bind="source: this">
  </div>
  <br/>
  <br/>
  <div id="working-div" data-template="working-template" data-bind="source: this">
  </div>
</body>
</html>

JavaScript 只是创建了一个具有单个属性的视图模型并将其绑定到两个 div：

var viewModel = kendo.observable({foo: "bar"});

kendo.bind($("#broken-div"), viewModel);
kendo.bind($("#working-div"), viewModel);

在这两种情况下，只有第一个根元素及其子元素被正确绑定。这表明每次我将数据绑定到具有多个元素的模板时，我都需要确保它被包装在一个根中。

这种行为是否记录在某处？Kendo 或我的示例代码中是否存在错误？关于剑道为什么需要单根的解释也很好听。

（作为 jsfiddle 的示例代码）

4

1 回答 1

1

除了您提到的一个地方外，它没有记录。这就是 Kendo UI 文档的状态——它还不够完整。我已经使用 Kendo UI 三年了，据我所知，这是它的默认行为，而不是错误。不幸的是，这是您从经验中学习（偶然发现）的众多怪癖之一。

于 2014-05-29T20:19:30.317 回答