从包含视图模型访问数据

The*_*ook 4 requirejs knockout.js durandal

你知道它已经安静了很久,对吧?;-)

我有一个主视图模型.在视图中,我使用compose绑定来加载子视图,就其显示的数据而言,该视图是"独立的".

<div data-bind="compose: articleSection"></div>
Run Code Online (Sandbox Code Playgroud)

而"articleSection"只是一个包含字符串的observable:

var articleSection = ko.observable('viewmodels/lt_articleRead');
Run Code Online (Sandbox Code Playgroud)

...因为根据用户操作,我可能想要在该div中加载不同的视图/模型.

在我的主视图模型中,我还有一个可观察的"articleSelected":

var articleSelected = ko.observable(true);
Run Code Online (Sandbox Code Playgroud)

...从列表中选择文章时设置的...

在我的子视图(lt_ArticleRead)里面我有两个可以显示的div.如果articleSelected为false,则为one;如果为true,则为one:

<div id="articleSelected" data-bind="visible: articleSelected()">
...
</div>
<div id="articleNotSelected" data-bind="visible: articleSelected()">
     <p>Please select an article from the list on the left or create a new one</p>
</div>
Run Code Online (Sandbox Code Playgroud)

我尝试使用"$ root.articleSelected()"和"$ parent.articleSelected"从主视图模型访问observable但是都不起作用.我是否必须"要求"子视图中的父视图模型才能正常工作?

nem*_*esv 5

您需要设置preserveContext:true撰写绑定.

<div data-bind="compose: { model: articleSection, preserveContext: true }"></div>
Run Code Online (Sandbox Code Playgroud)

文档(我强调):

每当组合发生时,就会在该组合视图和视图模型周围创建一个独立的绑定上下文.因此,从该视图内部,您无法到达外部的其他模型对象.我们认为这对于封装非常重要,因为我们已经看到一些非常糟糕的架构事件发生在你可以"意外"引用范围之外的事情时.因此,默认情况下封装了一些东西.如果需要,可以设置preserveContext:true绑定以将新组合"连接"到其父组件,并启用从子组合内部向上走的树,但这不是默认值.