Question

我有一个具有以下结构的模型knockoutJS模型：

this.optionGroup = ko.obervable({});

此对象中有一个名为isAvailable的选项，其值为＆＃34; true＆＃34;或＆＃34;假＆＃34;。

我遇到的问题是在＆＃34; true＆＃34;如果＆＃34; false＆＃34;这样对用户来说会更友好。我尝试了各种选项，最后一个选项如下：

<div data-bind="text: optionGroup().isAvailable === 'true'? 'Yes' : 'No'"></div>

不幸的是，这总是评估为假，因此显示“不”。在HTML中。这是我第一次使用knockoutJS，因为这是遗留页面，并且不确定是否可以根据isAvailable中设置的值轻松显示是/否标签。

由于

Answer 1

来自你的评论：

我设置的值如下：object.isAvailable = "true" model.optionGroup(ko.mapping.fromJS(object));（object是ajax调用的响应，上面我正在硬编码值。）

这意味着isAvailable是一个可观察的，因为它是映射插件的工作。所以my comment中的＃3适用，您需要：

<div data-bind="text: ko.unwrap(optionGroup().isAvailable) === 'true'? 'Yes' : 'No'"></div>

或者，如果您总是确保在视图呈现之前已经进行mapper调用，则可以使用()代替ko.unwrap：

<div data-bind="text: optionGroup().isAvailable() === 'true'? 'Yes' : 'No'"></div>

我的第一个版本使用ko.unwrap，因为在您的初始optionGroup对象中，根本没有isAvilable，所以如果我们只使用.isAvailable()，那么扔，而ko.unwrap(...)赢了。

或者正如我在单独的评论中所说，计算而来：

this.optionGroup = ko.obervable({});
this.optionGroupAvailableText = ko.pureComputed(function() {
    return ko.unwrap(this.optionGroup().isAvailable) === 'true'? 'Yes' : 'No';
}, this);

然后：

<div data-bind="text: optionGroupAvailableText"></div>

KnockoutJS根据字符串显示/隐藏div

1 个答案: