Question

我的页面上有一个viewModel，它包含数据，用于概述某些设备的当前状态。到目前为止，一切都很有效，除了一个问题：我需要根据viewModel中的另一个值设置div元素的title属性。

我知道你基本上可以像这样设置title属性（在div标签的data-bind属性中）：

attr: { title: 'Some title' }

使用上面的语句，当悬停div时，“Some title”被设置为工具提示。我也可以这样设置：

attr: { title: ConnectState.Value() }

并输出当前viewModel数据的正确值（整数值），以便正确填充viewModel。

现在我需要将其更改为：

attr: {
  title: {
    'Text 1': ConnectState.Value() == 0,
    'Text 2': ConnectState.Value() == 1,
    'Text 3': ConnectState.Value() == 2,
    'Text 4': ConnectState.Value() == 3
  }
}

上面的例子只会将“[object Object]”作为标题（resp。as tooltip）。我该如何解决这个问题？非常感谢提前！

Answer 1

在viewmodel中定义一个ko.computed。

self.ConnectTitle = ko.computed(function() {
   return 'Text ' + (self.ConnectState.Value() + 1).toString();
});

然后： -

attr: { title: ConnectTitle }

作为你的约束力。如果你的文字只是一个简单的例子，你可以用适合你需要的东西替换计算函数的内容。

Answer 2

您可以使用三元运算符，如下所示：

attr: { 
  title: ConnectState.Value() == 0 ? 'Text 1' :
         ConnectState.Value() == 1 ? 'Text 2' :
         ConnectState.Value() == 2 ? 'Text 3' :
         'Text 4'
}

Knockout.js：有条件地绑定div的title属性

2 个答案: