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

Question

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

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

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

如何从filterViewModel 访问我的mainViewModel 以设置由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
    }
}

正如 cmets 指出的那样，这会引入不必要的依赖。所以最好传递你要使用的属性而不是父模型。

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”可以是标识您选择的模型属性的任何唯一字符串。