0

我正在尝试将 Jade 用于一个用于 html 模板的简单 Web 应用程序。我的 JSON 看起来像：

{
    "responses": [
        {
          "fieldOne": 1,
          "fieldTwo": 2,
          "fieldThree": "Some string"
        },
        {
          "fieldOne": 10,
          "field2": 20,
          "fieldFour": "Some other string"
        }
    ]
}

我正在尝试在 Jade 中遍历此响应列表，并在表中为每个响应创建一行。循环似乎工作正常，问题是某些响应缺少字段，如果该字段丢失，我想在该单元格中放置一个空白。我将一张地图（来自 Spark）传递给 Jade，其中只有一个条目“responseData”，它映射到整个 JSON 对象。

body
    div
        table
            thead
                tr
                    th Field One
                    th Field Two
                    th Field Three
                    th Field Four
            tbody
                each val in responseData.responses
                    tr
                        td
                            #{val.fieldOne}
                        td
                            #{val.fieldTwo}
                        td
                            #{val.fieldThree}
                        td
                            #{val.fieldFour}

如果每个响应都包含所有四个字段，则此方法现在有效。我想用 if 条件替换这些条件，在它尝试读取值之前检查该字段是否存在。就像是：

td
    if val.fieldFour
        #{val.fieldFour}

如果 fieldFour 不存在，这将返回“无法访问或未知的属性 fieldFour”。我想知道如何检查 val 是否具有特定属性。我已经尝试过按照 Jade 教程，尝试在前面添加locals，使用括号符号等，但无济于事。我还没有找到在循环内完成此操作的示例，因此这可能是一个问题。

我已经查看了所有其他堆栈溢出问题，因此感谢您的帮助！谢谢！

4

1 回答 1

0

我设法通过将散列换成#感叹号来实现这一点!。

两者的区别在于#转义数据和!原始数据。您可以在此处查看差异的工作示例 - http://naltatis.github.io/jade-syntax-docs/#escaping

玉：

- responseData = { "responses": [{"fieldOne": 1,"fieldTwo": 2,"fieldThree": "Some string"},{"fieldOne": 10,"field2": 20,"fieldFour": "Some other string"}]}

table
  thead
    tr
      th Field One
      th Field Two
      th Field Three
      th Field Four
  tbody
    each val in responseData.responses
      tr
        td
          if val.fieldOne
            !{val.fieldOne}
        td
          if val.fieldTwo
            !{val.fieldTwo}
        td
          if val.fieldThree
            !{val.fieldThree}
        td
          if val.fieldFour
            !{val.fieldFour}

我在这里有一个工作版本 - http://codepen.io/AdamCCFC/pen/akrjVv

于 2016-08-17T16:40:54.690 回答