用 Rivets.js 输出 class？

Question

我认为这会更容易，除非我遗漏了一些东西，但我不知道如何将我的一段数据输出为 class。

<div class="partner-type" rv-class="partner.partner-type"></div>

不起作用。它应该说属性 "technology" 或 "service" 中的值。反正有做字符串插值之类的吗？数据属性？

Answer 1

我最终使用了类似

的东西

rv-class-ineededthisclass="partner.partner_type | isNotEqual 'premier'"

顺便说一句，这个库非常适合 rivetsjs： https://github.com/matthieuriolo/rivetsjs-stdlib

Answer 2

我遇到了同样的问题。我创建了一个名为 "rv-set-class" 的活页夹来解决这个问题。

rivets.binders['set-class'] = function(el, value){
     el.className += ' '+ value;   
}

您现在可以像这样使用它：

<div rv-set-class="partner.partner-type"></div>

Answer 3

您可以在 official Github documentation page 中找到一个简单的自定义 Binder，它的行为完全符合您的要求：它将存储在变量中的类名动态分配给绑定元素。

AddClass (rv-addclass)

Adds a new class to the element (using the attribute value) in addition to any existing ones. On subsequent changes, the previously added class is replaced with the new one.

活页夹声明：

rivets.binders.addclass = function(el, value) {
  if (el.addedClass) {
    $(el).removeClass(el.addedClass);
    delete el.addedClass;
  }

  if (value) {
    $(el).addClass(value);
    el.addedClass = value;
  }
};

用法：

<i rv-addclass="partner.partner_type"></i>

用 Rivets.js 输出 class？

Outputting a class with Rivets.js?

javascript

rivets.js

AddClass (rv-addclass)