Jade/Pug中使用对象进行JSON内插

Question

我似乎找不到关于Pug与JSON插值行为的充分文档。看起来你是可以这样做的，但我发现的方法差别很大，并且没有一个完全符合我的要求。顺便说一下，我正在使用gulp-pug。

如果有一个JSON对象如下：

{
  0: {name: "zero", desc: "the additive identity"},
  1: {name: "one", desc: "the multiplicative identity"},
  2: {name: "two", desc: "the first prime number"}
}

要插值一个类似这样的模板

ul
  li(interpolated=0) BlaBlaBla
  li(interpolated=1) EtcEtcEtc

将它转换成类似这样的东西？

<ul>
  <li title="zero" desc="the additive identity">BlaBlaBla</li>
  <li title="one" desc="the multiplicative identity">EtcEtcEtc</li>
</ul>

抱歉表述不够清楚。Pug能胜任这个任务吗？我非常怀疑。如果无法完成，请推荐替代方案。

- oink

Answer 1

是的，PUG（前身为JADE）具有插值功能。您是否已经阅读了官方的Jade语言参考文档？请阅读插值部分。

首先要做的是将您的JSON解析为一个在Jade模板中可访问的对象。您可以使用express、gulp、grunt等工具来完成此操作。

例如，您的对象名称为interpolated，则它应如下所示：

interpolated = {
  0: {name: "zero", desc: "the additive identity"},
  1: {name: "one", desc: "the multiplicative identity"},
  2: {name: "two", desc: "the first prime number"}
}

以下是默认的Javascript行为。要在模板中进行插值，应该像这样：

ul
  li(title= interpolated[0].name, desc= interpolated[0].desc) BlaBlaBla
  li(title= interpolated[1].name, desc= interpolated[1].desc) EtcEtcEtc
  li(title= interpolated[2].name, desc= interpolated[2].desc) EtcEtcEtc

猜测这是第一印象，阅读文档，您将很快学习。

- Daniel