Question

我在页面中使用了两个视图模型mainViewModel和filterViewModel，其中filterViewModel由mainViewModel实例化

function mainViewModel() {
    this.data   = ko.observableArray();
    this.filter = new filterViewModel();
}

function filterViewModel() {
    this.filter = function() {
        // ajax blablabla
    }
}

如何从mainViewModel访问我的filterViewModel，以便将filterViewModel执行的ajax结果设置为父视图模型中的data变量？

Answer 1

为了简单起见，只需将父级明确传递给子级。

function mainViewModel() {
    this.data   = ko.observableArray();
    this.filter = new filterViewModel(this);
}

function filterViewModel(parent) {
    // do whatever with the parent
    this.filter = function() {
        // ajax blablabla
    }
}

正如评论所指出的那样，引入了不必要的依赖。因此，最好传递要使用的属性而不是父模型。

function mainViewModel() {
    this.data   = ko.observableArray();
    this.filter = new filterViewModel(this.data);
}

function filterViewModel(data) {
    // do whatever with the data
    this.filter = function() {
        // ajax blablabla
    }
}

或者你可以使用一个很棒的淘汰插件knockout-postbox

function mainViewModel() {
    this.data = ko.observableArray()
         .syncWith('parentData');
    this.filter = new filterViewModel();
}

function filterViewModel() {
    this.parentData = ko.observableArray()
        .syncWith('parentData');

    this.filter = function() {
        // ajax blablabla
        // do whatever with this.parentData
    }
}

请注意，“parentData”可以是标识所选模型属性的任何唯一字符串。

如何在Knockout中选择父视图模型？

1 个答案: