Question

关于嵌套的dom绑定

就是这样

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

或有其他方法解决

Answer 1

如果您需要混合多个视图模型，则命名空间插件可能是最佳解决方案。

典型的答案是让主视图模型具有子视图模型并绑定到主视图模型。像：

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

ko.applyBindings(viewModel);

现在，您必须将点击绑定到body.click和div.click。

典型的模式是做这样的事情：

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

现在，您将使用模板绑定，如果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.div）。

此处示例：http://jsfiddle.net/rniemeyer/7ZsGK/

knockoutjs：关于嵌套的dom绑定

1 个答案: