javascript - 多个模型绑定(bind)以及每个绑定(bind)的调试数据

Question

我使用以下语法将三个 View 模型绑定(bind)附加到单个页面:

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

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

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

当然，现在 $root 上下文已移至特定元素，仅使用 $root 不会返回任何内容。我很难理解如何定位每个单独的 View 模型，以便我可以看到每个 View 的特定数据。

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

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>

这些测试中都没有返回任何内容

由于我显然不理解这里的范围，我希望有人能够教育我我所缺少的内容。

谢谢，

卡里.

*编辑了拼写。

Answer 1

您可以将调试字段绑定(bind)到 View 模型的组合:

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/