如何在玉模板中进行 javascript 数学运算？答案

【问题标题】：How to do javascript math in a jade template?如何在玉模板中进行 javascript 数学运算？
【发布时间】：2018-02-21 16:20:06
【问题描述】：

我希望亮度是列表中项目顺序的函数

这是订单变量

{{order}}

这是我要修改的模板语言

.minicard(style="background-color:hsl(354,100%,{{(order * 2)+46}}%)")

我基本上想要做的是将 order 乘以 2 并添加 46。

{{order}} 有效，但在大括号内进行数学运算似乎无效。玉模板中如何做简单的javascript？

【问题讨论】：

你看过stackoverflow.com/questions/20940860/…吗？
jade 是服务器端，javascript 是客户端。除此之外，{{ }} 通常是一些客户端框架符号，可能是 AngularJs 或 Handlebars？
看看stackoverflow.com/questions/10368040/…
它正在使用 Meteor
我觉得应该是#{yourValue}。因为是jade插值都是这样写的。和metor无关

【解决方案1】：

不需要 JavaScript，你可以这样做：

- order = 10
- order = order * 2 + 45

.minicard(style="background-color:hsl(354,100%,"+order+"%;")

或者你可以内联：

- order = 10

.minicard(style="background-color:hsl(354,100%," + (order * 2 + 45) + "%;")

两者都应该编译成：

<div class="minicard" style="background-color:hsl(354,100%,65%"></div>

【讨论】：