一个 Knockout.JS ViewModel 中的多个数组

Question

我遇到了运行我必须在同一个视图中使用多个 ViewModel 的情况。我通过使用这种允许对 DOM:

的不同项目进行多次绑定的技巧来实现这一点

ko.applyBindings(supervisors, $('#supervisorContainer')[0]);
ko.applyBindings(permits, $('#permitContainer')[0]);

在以前的视图中，我只需要绑定一个迷你对象，例如 PeopleModel。现在随着其他页面变得越来越复杂，我觉得更好的方法是将这些较小的模型作为数组封装在较大的主模型中。我还没有看到这方面的任何例子，所以假设我们有一个项目。在这个项目中有很多主管和很多许可证。 supervisors 和 permits 是可观察的数组。现在我把它们都作为自己的模型，但从概念上讲，唯一的模型是 ProjectModel，然后将 Supervisors 和 Permits 作为数组包含在该模型中可能更有意义。

使用来自 Knockout.JS 网站的示例，我看不出如何将这样的东西转换为内部具有多个数组的 ProjectModel，主要是因为语言，例如如何 gifts 被传递给函数。

var GiftModel = function(gifts) {
    var self = this;
    self.gifts = ko.observableArray(gifts);

    self.addGift = function() {
        self.gifts.push({
            name: "",
            price: ""
        });
    };

    self.removeGift = function(gift) {
        self.gifts.remove(gift);
    };
};

var viewModel = new GiftModel([
    // Data goes in here 
]);
ko.applyBindings(viewModel);

这样的思路对吗？或者，还有更好的方法？以下代码实际上似乎适用于视图中的 foreach 循环：

var ProjectModel = function(supervisors, permits) {
    var self = this;
    self.supervisors = ko.observableArray(supervisors);
    self.permits = ko.observableArray(permits);

    self.addPermit = function() {
        self.permits.push({
            number: "",
            date: ""
        });
    };

    self.removePermit = function(permit) {
        self.permits.remove(permit);
    };

    self.addSupervisor = function() {
        self.supervisors.push({
            name: "",
            number: ""
        });
    };

    self.removeSupervisor = function(supervisor) {
        self.supervisors.remove(supervisor);
    };

};

var viewModel = new ProjectModel(supervisorJSONArray,permitJSONArray);
ko.applyBindings(viewModel);

Answer 1

你真的 'melded' 两个 viewModels 在一起...相反我会 'composite' 它们在一起，像这样：

var PermitsViewModel = function(permits) {
    // Permits functionality and observables here
}
var SupervisorsViewModel = function(supervisors) {
    // Supervisors functionality and observables here
}

var ProjectModel = function(supervisors, permits) {
    var self = this;
    self.supervisorsViewModel = new SupervisorsViewModel(supervisors);
    self.permitsViewModel = new PermitsViewModel(permits);

};

var viewModel = new ProjectModel(supervisorJSONArray,permitJSONArray);
ko.applyBindings(viewModel);

然后您可以在视图中使用 'with' 语句来引用适当的视图模型。

一个 Knockout.JS ViewModel 中的多个数组

Multiple arrays in one Knockout.JS ViewModel

javascript

php

arrays

knockout.js