knockout.js - 我可以在模板绑定中传递变量吗？

Question

我知道这不是长期使用的好方法，但是对于故障排除，有什么方法可以在绑定模板时传递一个简单的字符串，然后将其作为模板中的变量访问？例如，如果这是我的绑定：

<!-- ko template: { name: tmplOne }, myvar: 'apple' -->

这是tmplOne：

<div>
    <span>Fruit: </span>
    <span data-bind="text: myvar"></span>
</div>

这将导致以下结果：

fruit: apple

即使我必须在名为“fruit”的视图模型中声明一个 observable，我可以在模板绑定中手动设置它吗？

Answer 1

利用

<!-- ko template: { name: tmplOne, templateOptions: {myvar: 'apple'} } -->

更多信息：http: //www.knockmeout.net/2011/03/quick-tip-reusing-template-by-passing.html

Answer 2

您可以为模板绑定提供数据参数并定义对象文字，如果您想要就像您正在做的那样：

<!-- ko template: { name: tmplOne }, myvar: 'apple' -->

而是这样做：

<!-- ko template: { name: tmplOne, data: { myvar: 'apple' } } -->

http://knockoutjs.com/documentation/template-binding.html

Answer 3

对于阅读更高版本淘汰赛的人来说，这似乎是组件与模板的一个很好的用例。

Answer 4

data您可以通过向绑定参数提供组合来将任意数据传递给模板，同时保持当前应用的 viemodel 。

例如，您可以将模板内容包装在with绑定中，绑定到组合$data属性，创建新的绑定上下文。这样，当前应用的绑定就不需要更新了。

ko.applyBindings({
  fruits: ['banana', 'orange']
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>

<div data-bind="template: { name: 'tmplOne', data: { myModelData: $data, myVar: 'apple' } }"></div>

<script type="text/html" id="tmplOne">
  <!-- ko with: myModelData -->
    <span>My model</span>
    <ul data-bind="foreach: fruits">
      <li data-bind="text: $data"></li>
    </ul>
    <div>
      <span>My custom data:</span>
      <span data-bind="text: $parent.myVar"></span>
    </div>
  <!-- /ko -->
</script>