Question

我无法弄清楚当条件满足时如何将class添加到div。我有什么选择？

这就是我想要实现的目标：

<div class="wbackground rfonts {{if data.isPerson}}person{{else if data.isCat}}cat{{/if}}">

    ...

</div>

到目前为止，我已尝试使用if属性中的class标记，但它无法正常工作。有什么想法吗？

Answer 1

如果您正在使用JsViews - 即您正在进行数据链接（UI与数据的动态数据绑定），请调用link()方法，然后在此处查看http://www.jsviews.com/#samples/data-link以获取整个教程序列数据链接元素上的样本，实际上是从包含

的普通JsRender样本开始的

<span class="{{if role.indexOf('Lead')>=0}}special{{/if}}">。

请注意，只使用JsRender和render()方法时，完全允许使用该语法。

但是，如果您想使用数据链接，那么示例将向您展示如何执行此操作，包括用于链接类的特定示例：http://www.jsviews.com/#samples/data-link/class以及用于切换类的http://www.jsviews.com/#samples/data-link/toggle。< / p>

如果您只是使用JsRender（调用render()方法而不是link()方法），那么另请参阅http://www.jsviews.com/#iftag，其中解释了有关如何使用{{if}} ... {{else ...}} {{else}} ... {{/if}}的所有内容。

Answer 2

使用if和else。 else会像elseif一样吵闹。代码如下：

<div class="wbackground rfonts {{if data.isPerson}}person{{else data.isCat}}cat{{/if}}">

如果需要更多参考，请查看此处的文档：http://www.jsviews.com/#iftag

为了更清楚这个解释，尝试将下面的else（elseif）序列中的值更改为true / false：

{{if b1}}person{{else b2}}cat1{{else b3}}cat2{{/if}}

下面是布尔参数组合：

   b1=true, b2=true,b3=true => "person"
   b1=false, b2=true,b3=true => "cat1"
   b1=false, b2=false,b3=true => "cat2"
   b1=false, b2=false,b3=false => ""

Else的工作方式与普通的其他方式相同，没有任何布尔参数。

当条件用jsrender满足时，将一个类添加到div

2 个答案: