从Knockoutjs中的子级引用计算属性

Question

所以我有一个模型：

// Parent View Model
GameViewModel = function (data) {
    var self = this;
    ko.mapping.fromJS(data, resultItemMapping, self);
    self.PlayerCount = ko.computed(function () {
        return self.Results().length;
    });
};

使用这些映射，它的子级：

var resultItemMapping = {
    'Results': {
        key: function (resultItem) {
            return ko.utils.unwrapObservable(resultItem.Id);
        },
        create: function (options) {
            return new ResultItemViewModel(options.data); 
        }
    }
};
// Child View Model
ResultItemViewModel = function (data) {
    var self = this;
    ko.mapping.fromJS(data, resultItemMapping, self);
    self.Points = ko.computed(function () {
        return (parent.PlayerCount);
    });
};

你可以看到，游戏视图模型（父）有一个名为PlayerCount（self.PlayerCount）的计算可观察对象，我可以成功地将其绑定到我的视图，并且数量会根据Results（子）集合的长度而相应增加/减少。

问题在于名为Points（self.Points）的子计算可观察对象。绑定到它的控件总是空的，如果我尝试执行类似return (parent.PlayerCount * 10)的操作，我总是会返回NaN。

理想情况下，根据玩家数量，结果项目积分总和应为n * PlayerCount。

很明显，我编码的内容不能正常工作，但我没有收到任何控制台错误消息。有没有更好的方法来实现我想要实现的目标？

Answer 1

这很容易。映射插件为您提供父级：

var GameViewModel = function (data) {
    var self = this;
    self.Results = ko.observableArray();    
    self.PlayerCount = ko.pureComputed(function () {
        return self.Results().length;
    });
    ko.mapping.fromJS(data, GameViewModel.mapping, self);    
};
GameViewModel.mapping = {
    Results: {
        key: function (resultItem) {
            return ko.unwrap(resultItem.Id);
        },
        create: function (options) {
            return new ResultItemViewModel(options.data, options.parent); // <- here
        }
    }
};
var ResultItemViewModel = function (data, parent) {
    var self = this;
    self.Id = ko.observable();
    self.Points = ko.pureComputed(function () {
        return parent.PlayerCount();
    });
    ko.mapping.fromJS(data, ResultItemViewModel.mapping, self);
};
ResultItemViewModel.mapping = {
    // I can't imagine you want the same mapping definition as in the GameViewModel
};

请注意，我还做了一些其他细微的更改，最突出的是使用了纯computed。我还喜欢使视图模型属性显式，而不是完全依赖于映射插件。这样可以防止代码访问不存在的属性，并且通常会使调试更加容易。