在Angular2 HTML模板中显示/可视化具有任意深度的JSON

Question

我有一个任意深（1到n）的json结构，在这种结构中还有其他重复结构。如何在html模板中显示所有元素（键和值）？

编辑：我想迭代所有键和值

作为一个例子，我可以给出以下结构：

{
  "contract": [{
    "part a": [{
      "x": "foo"
    }, {
      "y": [{
        "i": "one"
      }, {
        "ii": "two"
      }, {
        "iii": [{
          "part a": [{
            "x": "bar"
          }, {
            "y": [{
              "i": [{
                "part a": [{
                  "x": "nix"
                }]
              }]
            }]
          }]
        }]
      }]
    }]
  }, {
    "part b": [{
      "x": "any"
    }, {
      "y": [{
        "i": {
          "part a": [{
            "x": "some"
          }]
        }
      }]
    }]
  }]
}

图片如下：

Answer 1

您可以使用JSON pipe在模板中显示JSON数据：

<div>{{data | json}}</div>

Answer 2

我用递归指令解决了它，没有人帮助过我：/