Question

我无法弄清楚如何从匿名computed function内部访问视图模型中的其他项目。如何获取/ self / sys或对视图模型的引用？

var sys = {

    viewModel: {

        first: ko.observable('John'),
        last: ko.observable('Doe'),
        name: ko.computed(function() {

            // this.first?
            // this.viewModel.first()?
            // sys.viewModel.first?

            console.log(this);
            return 'first + last';
        }),
    }
};


$(function() {

    ko.applyBindings(sys.viewModel, $('#cont')[0]);
});

Answer 1

由于对象的布局方式以及挖掘如何运行您为计算机提供的功能，您目前无法轻松访问这些属性。您可以改为稍微改变布局以使用IIFE来创建对象实例：

var sys = new (function(){
    this.viewModel = new (function() {
        this.first = ko.observable('John');
        this.last = ko.observable('Doe');
        this.name = ko.computed(function() {
            return this.first() + ' ' + this.last();
        }, this); //Note "this" - see below
    })();
})();

Knockout computeds采用第二个参数来指定运行时this的值应该是什么。通过以这种方式重写viewmodel，我们可以将当前对象作为this参数传递给要使用的计算回调。

此处an update to your fiddle。

Answer 2

您必须使用该构造函数，例如

sys = function() {
    var self = {};
    self.first = ko.observable('John');
    self.last = ko.observable('Snow');
    self.Name = ko.computed(function() {
        return self.first + self.last;
    });
    return {
        viewModel:self
    };
}();


$(function () {

    ko.applyBindings(sys.viewModel, $('#cont')[0]);
});

请注意函数声明后的括号。这使得函数自我应用，为您提供实例。

Answer 3

您可以在视图模型对象文字之外创建function resize() { canvas.width = window.innerWidth; canvas.height = window.innerHeight; render(); } window.addEventListener('resize', resize, false); resize(); function render() { // draw to screen here }可观察对象，如下所示：

computed

如何在视图模型不是函数的情况下创建KnockoutJS计算的observable？

3 个答案: