Question

我正在创建一个包含多个子视图模型的向导。

一个view-model (step 3) is a copy of this knockout form and consists of two radio button groups，其中第一组控制第二组中可用的选项。

我在这个子视图中使用时无法绑定单选按钮，虽然它作为一个独立的视图模型工作，但当用作子视图时，self.availableDatabases ko.computed函数似乎永远不会调用（换句话说，它似乎没有绑定到视图模型）。

select db radio group绑定到子视图模型availableDatabases，代码如下：

<h1>Select OS:</h1>
<div data-bind="foreach: os" >
    <div>
        <input type="radio" name="os" data-bind="attr: {value: name}, checked: $root.selectedOs" />
        <span data-bind="text: name"></span>
    </div>    
</div>
<h1>Select DB:</h1>
<div data-bind="foreach: availableDatabases" >
    <div>
        <input type="radio" name="db" data-bind="attr: {value: name}, checked: $root.selectedDb" />
        <span data-bind="text: name"></span>
    </div>    
</div>

The fiddle for the entire wizard code is here，我在整合到子视图模型时遇到了什么错误？

Answer 1

您需要使用$parent代替$root。

$root引用您的主视图模型在您的案例ViewModel中的applyBindings调用中传递的内容，但selectedOs上有selectedDb和ConfigureModel属性}}。

所以你需要使用$parent来＆＃34;去一级＆＃34;在foreach中访问您的媒体资源（或者您可以使用$root.configureModel().selectedOs一直到顶部并向下移动到configureModel）

<h1>Select OS:</h1>
<div data-bind="foreach: os" >
    <div>
        <input type="radio" name="os" data-bind="attr: {value: name}, 
               checked: $parent.selectedOs" />
        <span data-bind="text: name"></span>
    </div>    
</div>
<h1>Select DB:</h1>
<div data-bind="foreach: availableDatabases" >
    <div>
        <input type="radio" name="db" data-bind="attr: {value: name}, 
               checked: $parent.selectedDb" />
        <span data-bind="text: name"></span>
    </div>    
</div>

演示JSFiddle.

您可以在documentation中了解这些绑定上下文属性。

当viewmodel用作子视图模型向导样式对话框时，knockout foreach绑定不起作用

1 个答案: