Question

我在2 Model上使用knockout.js，但这不起作用。

function AppViewModel1(Name) {
    this.firstName = ko.observable(Name.fn);
    this.lastName = ko.observable(Name.ln);
}

function AppViewModel2(Name) {
    this.first = ko.observable(Name.fn);
    this.last = ko.observable(Name.ln);
}

 ko.applyBindings(new AppViewModel1({ fn : "yahoo", ln: ".in" }));
 ko.applyBindings(new AppViewModel2({ fn : "gmail", ln: ".com" }));

有人可以解释一下，我错了吗？

Answer 1

通常，Knockout只允许绑定到单个视图模型。

视图模型可以包含对其他JS对象/类的引用，但只能绑定一个视图模型。

但是，有一个插件可用于在Knockout中绑定多个视图模型：

https://github.com/hunterloftis/knockout.namespaces

看一看，看看它是否解决了你的问题

Answer 2

您需要限制绑定的dom部分适用于哪个部分。您可以在同一页面/文档上绑定多个视图模型，但它们不能重叠。因此，请指定一些ID并限制绑定到页面的不同部分。

或者，您可以传递第二个参数来定义要搜索数据绑定属性的文档的哪个部分。例如，ko.applyBindings(myViewModel, document.getElementById('someElementId'))。这会将激活限制为具有ID someElementId及其后代的元素，如果您希望拥有多个视图模型并将每个视图模型与页面的不同区域相关联，这将非常有用。

来自Knockout observables docs

示例：

function AppViewModel1(Name) {
    this.firstName = ko.observable(Name.fn);
    this.lastName = ko.observable(Name.ln);
}

function AppViewModel2(Name) {
    this.first = ko.observable(Name.fn);
    this.last = ko.observable(Name.ln);
}

ko.applyBindings(new AppViewModel1({ fn : "yahoo", ln: ".in" }),
    document.getElementById('gmailArea'));
ko.applyBindings(new AppViewModel2({ fn : "gmail", ln: ".com" }),
    document.getElementById('yahooArea'));

如果您绝对必须在页面的相同部分内访问相同的视图模型，那么您只需将它们全部合并到一个视图模型中。不漂亮，但最重要的是。

例如

function AppViewModel1(Name) {
    this.gmailFirstName = ko.observable(Name.gmailFn);
    this.gmailLastName = ko.observable(Name.gmailLn);

    this.yFirst = ko.observable(Name.yFn);
    this.yLast = ko.observable(Name.yLn);
}

ko.applyBindings(new AppViewModel1({ gmailFn: "google", gmialLn: ".com", yFn : "yahoo", yLn: ".in" }));

我没有使用命名空间plulgin jimmym链接，但听起来很有趣。

为什么这个js代码不起作用？

2 个答案: