从 Knockoutjs 中的 child 引用计算的 属性

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;
    });
};

使用这些映射是 children:

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);
    });
};

您可以看到游戏视图模型 (parent) 有一个名为 PlayerCount (self.PlayerCount) 的计算可观察对象，我可以成功地将其绑定到我的视图，并且数量会相应地增加/减少关于 Results (child) 集合的长度。

问题出在称为点 (self.Points) 的 child 计算可观测值上。绑定到它的控件总是空的，如果我尝试做类似 return (parent.PlayerCount * 10) 的事情，我总是会返回 NaN。

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

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

Answer 1

这很简单。 The mapping plugin provides the parent for you:

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
};

请注意，我还进行了其他一些细微的更改，最突出的是 pure computeds。我还喜欢使 viewmodel 属性显式化，而不是完全依赖于映射插件。这可以防止代码访问不存在的属性，并且通常使调试更容易。