knocket js if语句显示基于布尔数据类型的值

knockout js if statement to Display value based on boolean data type

本文关键字：于布尔 数据类型 显示 js if 语句 knocket      更新时间：2023-09-26

我正在尝试显示一个基于True或False表值的值。例如，如果值为True，则我希望它表示支持；如果值为False，则我要求它表示不支持！这是我的html代码

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

Java脚本代码

$(function() {
  dm.viewModel = function() {
    var clients = ko.observableArray(),
      selectedClient = ko.observable(),
      clientChanged = function() {
        $.getJSON(dm.WebServices + "/dm/get/clientinfo?client=" + encodeURIComponent(selectedClient()), function(data) {
          if (data != null) {
            dm.viewModel.Name(selectedClient());
            dm.viewModel.Support(data[0]['Support']);
          }
        })
        $('#divClientData').show();
      },
      LoadClients = function() {
        $('#divClientData').hide();
        $.getJSON(dm.WebServices + "/dm/get/clientlist", function(data) {
          $.each(data, function(key, val) {
            clients.push(val);
          });
        });
      },
      Name = ko.observable(),
      Support = ko.observable(),
      return {
        Name: Name,
        Support: Support
      };
  }();
  ko.applyBindings(dm.viewModel);
  dm.viewModel.LoadClients();
})

在这种情况下，您可以评估属性并根据值进行渲染。甚至可以在绑定内部提供函数。你可以使用这个：

<input type="text"  data-bind="value: Support() ? 'Supported' : 'Not Supported'"  />

您可以使用if绑定

请参阅此处的文档

文档示例：

<label><input type="checkbox" data-bind="checked: displayMessage" /> Display message</label>
<div data-bind="if: displayMessage">Here is a message. Astonishing.</div>

所以对你来说

<div data-bind="if: Support">Supported</div>
<div data-bind="ifnot: Support">Not Supported</div>

编辑：建议使用带有三元条件的值绑定的其他答案可能是实现这一点的更好方法。我会把这个作为参考，但我推荐这个解决方案。

在这种情况下，您要查找的是ko.conted（）.

已编辑：（支持似乎正在用作数据集中的值）为ViewModel添加一个新值，如下所示：

IsSupported = ko.computed(function(){
    if(this.Support() == true){
        return "Supported";
    } else {
        return "Not Supported";
    }
}, this)

然后，在标记中，您将不得不稍微更改数据绑定：

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

或者，如果你不想更改你的支持字段，你必须在HTML中做这样的事情，正如其他评论者所建议的那样：

<p><input type="text"  data-bind="value: (Support() ? 'Supported' : 'Not Supported')"  /></p>

然而，我推荐前者，因为实际上，您应该将该逻辑隐藏在ViewModel中。

（有关计算的更多信息，请参阅KO文档：http://knockoutjs.com/documentation/computedObservables.html)

在我的工作中，我使用KO布尔条件，如下所示：

<div id="bla" data-bind="visible: position != value"></div>

KO对于这些类型的问题非常有用。

相关文章：