Knockout.js 如何在敲除中将布尔值转换为是或否?

Knockout.js 如何在敲除中将布尔值转换为是或否?,knockout.js,Knockout.js,我有一个布尔变量,它在KnockoutJS中使用此元素进行绑定: 我想在UI中显示是或否,而不是真或假。我尝试了不同的函数将值转换为yes或no,但都不起作用。 我认为应该有一个简单的方法来做到这一点。有人能帮忙吗?使用以下代码行-使用条件运算符 <span data-bind="text: myBooleanVar? 'Yes' : 'No'"></span> 使用以下代码行-通过使用条件运算符 <span data-bind="text: myBooleanV

我有一个布尔变量,它在KnockoutJS中使用此元素进行绑定:

我想在UI中显示是或否,而不是真或假。我尝试了不同的函数将值转换为yes或no,但都不起作用。
我认为应该有一个简单的方法来做到这一点。有人能帮忙吗?

使用以下代码行-使用条件运算符

<span data-bind="text: myBooleanVar? 'Yes' : 'No'"></span>

使用以下代码行-通过使用条件运算符

<span data-bind="text: myBooleanVar? 'Yes' : 'No'"></span>

拉维的答案是可行的,但在你的观点中包含这样的逻辑并不是最佳实践。您可以创建敲除计算函数或辅助函数:

var viewmodel = function() {
    var self = this;

    // the actual value (not attached to self to keep it private)
    var myBooleanVar = ko.observable(true);

    // wrapped version for the UI
    self.myBooleanUI = ko.computed(function(){
        return self.myBooleanVar() ? 'Yes' : 'No';
    });
}
观点:

<span data-bind="text: myBooleanUI"></span>

拉维的答案是可行的,但在你的观点中包含这样的逻辑并不是最佳实践。您可以创建敲除计算函数或辅助函数:

var viewmodel = function() {
    var self = this;

    // the actual value (not attached to self to keep it private)
    var myBooleanVar = ko.observable(true);

    // wrapped version for the UI
    self.myBooleanUI = ko.computed(function(){
        return self.myBooleanVar() ? 'Yes' : 'No';
    });
}
观点:

<span data-bind="text: myBooleanUI"></span>

您可以将逻辑放在视图@Ravi Dasari的答案中,或者放在视图模型@dperry的答案中,但我认为自定义绑定也是一种适用的方法

<span data-bind="boolean: myBooleanVar"></span> <!-- (Defaults to "Yes" or "No")-->
<span data-bind="boolean: myBooleanVar, trueText: 'Absolutely', falseText: 'Negative'"></span>


ko.bindingHandlers.boolean = {
    update: function (element, valueAccessor, allBindings) {
        var bool = ko.utils.unwrapObservable(valueAccessor()),
            trueText = allBindings.get('trueText') || 'Yes',
            falseText = allBindings.get('falseText') || 'No';
        $(element).text(bool ? trueText : falseText);
    },
};

您可以将逻辑放在视图@Ravi Dasari的答案中,或者放在视图模型@dperry的答案中,但我认为自定义绑定也是一种适用的方法

<span data-bind="boolean: myBooleanVar"></span> <!-- (Defaults to "Yes" or "No")-->
<span data-bind="boolean: myBooleanVar, trueText: 'Absolutely', falseText: 'Negative'"></span>


ko.bindingHandlers.boolean = {
    update: function (element, valueAccessor, allBindings) {
        var bool = ko.utils.unwrapObservable(valueAccessor()),
            trueText = allBindings.get('trueText') || 'Yes',
            falseText = allBindings.get('falseText') || 'No';
        $(element).text(bool ? trueText : falseText);
    },
};

在视图中包含逻辑是一种禁忌。它确实应该作为辅助函数或敲除计算返回到viewmodel中。如果myBooleanVar是可观察的,则除非您将其展开,否则这将不起作用。在视图中包含逻辑是一种禁忌。它确实应该作为辅助函数返回到viewmodel中或者一个敲除计算如果myBooleanVar是一个可观察的,除非你打开它,否则这不会起作用。