Knockoutjs 3.2.0 中的嵌套视图模型答案

【问题标题】：Nested ViewModels in Knockoutjs 3.2.0Knockoutjs 3.2.0 中的嵌套视图模型
【发布时间】：2015-03-05 04:09:03
【问题描述】：

我有一个应用于主 div 的全局视图模型

我还有一些其他的视图模型，我想将它们应用到我的主 div 的嵌套元素中

但我得到了

您不能对同一个元素多次应用绑定。

这是一个示例：

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
</head>
<body>

    <div id="main">

        <input data-bind="value:title,valueUpdate:'afterkeyup'" />

        <h1 data-bind="text:title"></h1>


        <hr />

        <div id="sub">

            <input data-bind="value:name,valueUpdate:'afterkeyup'" />
            <label data-bind="text:name"></label>

            <!-- a reference to title in globalViewModel -->
            <h1 data-bind="text:title"></h1>

        </div>

    </div>

    <script src="Scripts/knockout-3.2.0.js"></script>
    <script>

        var globalViewModel = {
            title : ko.observable("global title")
        }

        var subViewModel =  {
            name : ko.observable("Test")
        }

        ko.applyBindings(globalViewModel);
        ko.applyBindings(subViewModel, document.getElementById('sub'));

    </script>
</body>
</html>

请用您的出色解决方案指导我:)

【问题讨论】：

这两行可能是问题 ko.applyBindings(globalViewModel); ko.applyBindings(subViewModel, document.getElementById('sub'));您需要指定与第二个类似的第一个 applybindings 语句。第一个绑定将绑定应用于整个页面，而您正在尝试将绑定应用于页面的某些部分（已经有绑定）
KnockOutJS - Multiple ViewModels in a single View 的可能重复项
Nesting multiple VMs with nested DIVs 也有一个很好、简洁的答案。

标签： javascript html data-binding knockout.js viewmodel

【解决方案1】：

需要为两个视图模式分别应用绑定
或者可以在同一个 viewModal 中创建两个属性

【讨论】：