淘汰赛js根据属性值更新可见性答案

【问题标题】：knockout js update visibility based in property value淘汰赛js根据属性值更新可见性
【发布时间】：2012-10-06 11:16:14
【问题描述】：

我正在从这样的 Web API 加载数据：

$.getJSON("/api/Rule", function (rules) {
    self.Rules(rules);
});

然后我使用 foreach 绑定将Rules 绑定到一个表。每个Rule 都具有以下属性：Keyword、Attribute 和Value。

我想检查Keyword 是否是某个控制某些控件可见性的值。

data-bind="options: viewModel.Attributes, visible : Keyword != 'Else'"

问题是当我将Keyword 的值更改为不同的值时，可见性没有更新。

如何让它工作？

如果它应该通过某种绑定，我没有在我的视图模型中声明一个特殊的对象，我只是使用从服务器返回的任何东西。

【问题讨论】：

检查 Knockout 映射插件：knockoutjs.com/documentation/plugins-mapping.html 这将帮助您从 Json 数据创建一个 observable。还要确保检查您是否需要关键字或关键字（）。我会添加一个带有 data-bind="text: Keyword" 的跨度，这样您就可以检查值是什么。有时间我会发布更完整的答案
@WouterdeKort 我确实放置了一个跨度，但我没有看到关键字值没有更新。使用 Keyword() 也不起作用。它会引发错误“预期功能”。我猜你不能在数据绑定设置中使用它。
更新：我创建了一个与我的 Web Api 返回的名为 Rule 的对象完全相同的对象，而不是像上面那样设置值，我对返回的数据做了 $.each手动创建了一个 KO 对象的集合，然后我可以看到该值在我关闭标签后立即更新。如何在不创建重复/冗余的 KO 对象的情况下做到这一点

标签： knockout.js

【解决方案1】：

坦率地说，您必须将您的对象映射到可观察对象。这就是淘汰赛能够发挥其魔力的方式。使用mapping plugin 将使这变得微不足道。

$.getJSON("/api/Rule", function (rules) {
    var mappedRules = ko.mapping.fromJS(rules);
    self.Rules(mappedRules);
});

否则你可以自己映射。

$.getJSON("/api/Rule", function (rules) {
    var mappedRules = ko.utils.arrayMap(rules, function (rule) {
        return {
            Keyword: ko.observable(rule.Keyword),
            Attribute: ko.observable(rule.Attribute),
            Value: ko.observable(rule.Value)
        };
    });
    self.Rules(mappedRules);
});

请记住，您现在正在处理可观察对象，因此您需要调整绑定。

data-bind="options: viewModel.Attributes, visible : Keyword() != 'Else'"

【讨论】：