Knockout.js 条件绑定答案

【问题标题】：Knockout.js conditional bindingKnockout.js 条件绑定
【发布时间】：2012-09-16 00:29:03
【问题描述】：

如何根据其他属性进行条件绑定？

例子..

变量视图模型 = { IsAdded = ko.observable(), AdditionalBy = ko.observable() }

当我显示它时.. 如果 IsAddedBy 为 null 或 false，我不想显示 AdditionalBy

像这样..

&ltinput type="text" data-bind="value: if (IsAdded != null && IsAdded) { addedBy }"/>

我知道这是不对的，但是类似的事情......

【问题讨论】：

你想隐藏整个输入框，还是不填充它？如果您想完全隐藏它，请查看 Visible 绑定。如果您不想填充它，那么蒂姆的答案就是要走的路

标签： javascript data-binding knockout.js conditional

【解决方案1】：

我会做的就是这个；

var ViewModel = function() {
    this.IsAdded = ko.observable('True');
    this.AddedBy = ko.observable('Test');
    this.AddedByText = ko.computed(function(){
        if ( this.AddedBy() != null && this.IsAdded() ) return this.AddedBy()
        return "";
    }, this);
}

那么你的输入将是

<input type="text" data-bind="value: AddedByText" />

这样您就可以将逻辑包含在 ViewModel 中并与 HTML 分开。

【讨论】：

【解决方案2】：

这个问题很老，但它可能有助于其他人寻找

<input type="text" data-bind="value: IsAdded ? AddedBy : "" "/>

如果 IsAdded 不为空，则将 value 设置为 AdditionalBy，否则什么也不做

【讨论】：