哈巴狗/玉石和嵌入式javascript计算

时间:2018-11-24 07:20:19

标签: javascript pug

我又迷失了,试图在玉模板中做一些简单的计算。

给出此数据对象:

{
  "trade": {
    "name": "Mogens",
    "dst_currency": "EUR",
    "dst_value": 115.7,
    "src_price": null,
    "src_value": 2,
    "src_currency": "XMR",
    "date": null
    }
}

这个哈巴狗的来源:

table
  thead
    tr
      th Currency
      th Quantity
      th Price
      th Total
      th Date
  tbody
      tr
        script.
          if (trade.dst_currency === "EUR")
            trade.src_price = trade.dst_value / trade.src_value
          else
            trade.src_price = Number(trade.src_value) / Number(trade.dst_value)
        th.align-middle #{trade.dst_currency}
        th.align-middle #{trade.dst_value}
        th.align-middle= #{trade.src_price}
      th.align-middle #{trade.src_value} #{trade.src_currency}
      th.align-middle #{trade.date}

if trade.name === "Bob"
  h1 Hello Bob
else
  h1 My name is #{trade.name}

这是怎么做到的?我想念什么?

2 个答案:

答案 0 :(得分:0)

好的。终于找到答案了。

我不得不放弃内联脚本,而选择更简单的方法。

table
  thead
    tr
      th Currency
      th Quantity
      th Price
      th Total
      th Date
  tbody
      tr
        th.align-middle #{trade.dst_currency}
        th.align-middle #{trade.dst_value}
        if (trade.dst_currency === "EUR")
          th.align-middle #{trade.dst_value / trade.src_value}
        else
          th.align-middle #{trade.src_value / trade.dst_value}
        th.align-middle #{trade.src_value} #{trade.src_currency}
        th.align-middle #{trade.date}
p.
  EUR #{trade.dst_value / trade.src_value}
  XMR #{trade.src_value / trade.dst_value}

- var name = "Bobby"
if name == "Bob"
  h1 Hello #{name}
else
  h1 My name is #{trade.name}, born on #{trade.date}

编译为

<table>
  <thead>
    <tr>
      <th>Currency</th>
      <th>Quantity</th>
      <th>Price</th>
      <th>Total</th>
      <th>Date</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th class="align-middle">EUR</th>
      <th class="align-middle">115.7</th>
      <th class="align-middle">57.85</th>
      <th class="align-middle">2 XMR</th>
      <th class="align-middle">29 May, 1958</th>
    </tr>
  </tbody>
</table>
<p>
  EUR 57.85
  XMR 0.017286084701815037

</p>
<h1>My name is Mogens, born on 29 May, 1958</h1>

这实际上是有道理的。

(如果有人有想法,我仍然希望能够内联javascript)

答案 1 :(得分:0)

在Pug代码中放置script标签会在已编译的HTML中呈现script标签。编译时,它不会告诉Pug在script标记内执行任何javascript。如果要在编译代码时在Pug中运行javascript,请使用unbuffered code block

-
  // this is an unbuffered code block
  // that will update the value of `trade.src_price`
  // before it is rendered by Pug
  if (trade.dst_currency === "EUR") {
    trade.src_price = trade.dst_value / trade.src_value
  } else {
    trade.src_price = Number(trade.src_value) / Number(trade.dst_value)
  }

table
  thead
    tr
      th Currency
      th Quantity
      th Price
      th Total
      th Date
  tbody
    tr
      th.align-middle #{trade.dst_currency}
      th.align-middle #{trade.dst_value}
      th.align-middle= #{trade.src_price}
      th.align-middle #{trade.src_value} #{trade.src_currency}
      th.align-middle #{trade.date}

if trade.name === "Bob"
  h1 Hello Bob
else
  h1 My name is #{trade.name}