Jade/Pug JSON 插值与对象答案

【问题标题】：Jade/Pug JSON interpolation with objectsJade/Pug JSON 插值与对象
【发布时间】：2016-12-10 04:39:54
【问题描述】：

我似乎找不到任何关于 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>

抱歉含糊不清。帕格有这个能力吗？我对此表示高度怀疑。如果没有，请推荐替代方案。

【问题讨论】：

标签： json pug

【解决方案1】：

是的，PUG（前 JADE）能够进行插值。您是否已经阅读过 Jade lang 的官方参考资料？阅读interpolation的部分

您首先要做的是将您的 JSON 解析为一个可在您的翡翠模板中访问的对象。您可以使用 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

猜这是第一印象，阅读文档，你会学得很快。

【讨论】：