0

我使用以下语法将三个视图模型绑定附加到单个页面：

ko.applyBindings(new SomeViewModel(), document.getElementById("some-id-element"));

我想在测试页面时进行数据转储以观察模型状态。在我走多模型路线之前，我使用以下内容查看页面底部的页面模型数据。

<pre data-bind="text: ko.toJSON($root, null, 2)"></pre>

自然，现在 $root 上下文已被移入特定元素，仅使用 $root 就不会返回任何内容。我很难理解如何定位每个单独的视图模型，以便查看每个视图的特定数据。

我尝试将新模型分配为全局变量

testVar = new SomeViewModel();
ko.applyBindings(testVar, document.getElementById("some-id-element"));

并使用了以下示例：

<pre data-bind="text: ko.toJSON(testVar, null, 2)"></pre>
<pre data-bind="text: ko.toJSON(testVar.$root, null, 2)"></pre>
<pre data-bind="text: ko.toJSON($element.some-id-element, null, 2)"></pre>

这些测试中的任何一个都不会返回任何内容

由于我显然不了解这里的范围，我希望有人可以教育我我缺少什么。

谢谢你，

卡里。

*编辑拼写。

4

3 回答 3

1

您可以将调试字段绑定到视图模型的组合：

ko.applyBindings({vm1: vm1, vm2: vm2, vm3: vm3},
    document.getElementById("debug"));

<div id="debug">
    <pre data-bind="text: ko.toJSON(vm1, null, 2)"></pre>
    <pre data-bind="text: ko.toJSON(vm2, null, 2)"></pre>
    <pre data-bind="text: ko.toJSON(vm3, null, 2)"></pre>
</div>

​http://jsfiddle.net/MizardX/jxM9f/

或者，您应该能够访问全局变量。（假设它们确实是全局变量）

http://jsfiddle.net/MizardX/2Y6DF/

于 2012-12-29T01:26:39.880 回答
1

我更喜欢创建处理 ko.toJSON 方法的辅助函数。然后我在调用助手的视图模型上放置一个 ko.computed。这样我可以将视图模型上的 ko.computed 绑定到视图并显示它。如果我有多个视图模型绑定到一个视图，我可以使用标准绑定在同一页面上为每个视图模型显示一个。

<pre data-bind="text: debugInfo"></pre>
于 2012-12-29T15:03:34.023 回答
0

语法是

<div data-bind="text: ko.toJSON($root)"></div>​

请参阅http://jsfiddle.net/photo_tom/eY9w8/9/中的示例。如果单击任何列，则可以看到输出更改。

于 2012-12-29T00:37:45.223 回答