0

在我的视图中，我绑定到视图模型上的 ID（在我的情况下为 SKU），我有一个计算值，它执行如下查找（此处为小提琴链接）：

看法

<div data-bind="foreach: server">
    <div>
        <input type="radio" name="server" data-bind="attr: {value: sku}, checked: $root.selectedServer" />
        <span data-bind="text: name"></span>
    </div>
</div>
<p data-bind="text: selectedServer"></p>
<p data-bind="text: description"></p>

视图模型

var serverOptions = [{
    name: "One",
    sku: 1000,
    specification: "yes",
    price: 100
}, {
    name: "Two",
    sku: 1001,
    specification: "hello",
    price: 200
}, {
    name: "Three",
    sku: 1002,
    specification: "wow",
    price: 300
}];

viewModel = function() {
    var self = this;
    self.server = serverOptions;
    self.selectedServer = ko.observable();

    self.description = ko.computed(function () {
        var selectedSku = this.selectedServer();

        // needs to be checked as on viewmodel creation the computed function will be called
        // and selectedServer will not be selected
        if(typeof selectedSku == "undefined")
            return;

        var found = ko.utils.arrayFirst(serverOptions, function (item) {
            return item.sku == selectedSku;
        }, this);

        var textDescription = found.name + " - " + found.specification + " (" + found.price + ")";

        return textDescription;
    }, this);

    return self;
};

ko.applyBindings(new viewModel());

我将从单选按钮选择中进行大量此类查找，据我所知，需要对每个单选按钮执行错误检查，因为最初计算值所依赖的单选按钮将在视图模型上未定义创建 - 这使得视图模型代码非常“庞大”。

上面的代码是最有效的方法吗，可以将计算绑定触发器推迟到构建视图模型之前，还是有任何其他淘汰实用功能（或重构）可以使视图模型更清晰？

我的 javascript 技能仍然作为 C# 多年的速成课程慢慢融合在一起，它完全不同，所以感谢任何指针。

4

1 回答 1

1

要延迟计算的评估，请添加 deferEvaluation 选项。

self.description = ko.computed({
        read : function () {
        var selectedSku = this.selectedServer();

        [...]

        return textDescription;

      },
      deferEvaluation : true,

}, this);

请参阅有关deferEvaluation 的压缩文档。

于 2013-07-18T16:20:53.960 回答