Knockoutjs:关于嵌套的dom绑定

knockoutjs: about nested dom bindings

本文关键字：dom 绑定 嵌套 于嵌套 Knockoutjs      更新时间：2023-09-26

关于嵌套的dom绑定

http://jsfiddle.net/sxd1140/XWvYk/1/

只能这样

https://github.com/hunterloftis/knockout.namespaces

或有其他方法解决

如果您需要混合多个视图模型，那么名称空间插件可能是最好的解决方案。

典型的答案是有一个主视图模型和子视图模型，并绑定到主视图模型。如:

var viewModel = {
    body: {
        click: function() { alert("body"); }  
    },
    div: {
        click: function() { alert("body"); }  
    }
};
ko.applyBindings(viewModel);

现在，您必须将单击绑定到body。点击并点击。

典型的模式是这样做的:

var viewModel = {
  body: ko.observable(),
  div: ko.observable()
};

现在，你将使用模板绑定，它不会呈现任何东西，如果可观察对象是null，将允许你指定click而不是div.click，因为你将传递视图模型作为模板绑定的data参数。然后，如果/当子视图模型被填充(可能通过AJAX)， UI将更新。绑定应该是这样的:

<div data-bind="template: { name: 'main', data: body, templateOptions: { div: div } }"></div>
<script id="main" type="text/html">
    <button data-bind="click: click">body</button>
    <div id="a" data-bind="template: { name: 'div', data: $item.div }"></div>
</script>  
<script id="div" type="text/html">
    <button data-bind="click: click">div</button>
</script>

使用templateOptions将"div"视图模型传递给嵌套模板，以表明您不需要依赖具有全局作用域的viewModel(不需要访问viewModel)。

示例如下:http://jsfiddle.net/rniemeyer/7ZsGK/

相关文章：