挖空 JS 网格，禁止绑定语句中的字符

Knockout JS grid, proihibited chars in bind statement

本文关键字：语句 字符 绑定 禁止 JS 网格 挖空      更新时间：2023-09-26

我正在用Knockout js打印出网格的行。我希望我的观点基于迭代的索引是否可以被 2 整除来应用一个 CSS 类。

这是我的约束声明，每行都需要：

<data-bind="css: { $index % 2 === 0 ? 'grid_row' : 'grid_a_row' }">

出现了两个问题：

    在
  • 属性中似乎禁止使用%声明。我的IDE（VS2012）无法识别任何内容%后作为字符串的一部分（我可以通过颜色）
  • 这是应用一个类或另一个
    类的正确方法淘汰赛？还是我必须写两次$index % 2 === 0（每节课一次）？

哪些解决方案适用？

你的语法有点错误。您必须使用$index() % 2 === 0并且您使用的 css 绑定不正确。这将起作用：

<div data-bind="css: { grid_row: $index() % 2 === 0, grid_a_row: $index() %2 === 1 }">

http://jsfiddle.net/PYsc2/

是的，你是对的：

这是应用一个类或另一个类的正确方法 淘汰赛？还是我必须写 $index% 2 === 0 两次（每个类一个）？

您的 CSS 绑定语法不正确，它应该是： 

css: { 'name-of-css-rule': function(){}, 'another-css-rule': function(){} }

在您的情况下，您可以制作一个可观察的，例如： 

viewModel.myBooleanFunction = ko.computed(function() {
    return this.foo() % 0 === 0 ? "even" : "odd";
}, viewModel);

并在您的 CSS 绑定中像这样声明它：

data-bind="css: myBooleanFunction"

这些是动态 CSS 规则：寄件人： http://knockoutjs.com/documentation/css-binding.html

或者

，如果您更喜欢使用 attr 绑定，则可以像这样使用合并运算符。

data-bind="attr: { class: ($index() % 2 == 0) ? 'grid_row' : 'grid_a_row' }"

请注意，它将完全覆盖 class 属性，并且任何其他先前声明的类都将丢失。

相关文章：