Question

使用angular2。我有一个嵌套的Json，如：

[
  {
    "Name": "aa",
    "vallue": 11,
    "type": [
      {
        "test1": "value1",
        "test2": "value2",
      }
    ]
  },
  {
    "Name": "bb",
    "vallue": 22,
    "type": [
      {
        "test1": "value1",
        "test2": "value2",
      }
    ]
  }
    .....]

我必须根据Name访问这个Json数据。从URL成功检索名称，例如

    this.route.params.subscribe( params => {
          this.name= params['id'];

并在我的组件的构造函数中从url获取数据

constructor(private http : Http ,private route: ActivatedRoute){
      this.http.get('http://192.168.0.101:8000/json1')
      .map(response => response.json())
      .subscribe(data =>{ this.result = data});
        
    }

我想显示包含

的表格

<table border="1" cellspacing="10" cellpadding="10" width="500">
    <tr><th>NAME</th><th>Type</th><th>prefix</th><th>rate</th></tr>
    <tr *ngFor = "let d of result['{{name}}']">
        <td>{{name}}</td><td>{{d.test1}}</td><td>{{d.test2}}</td></tr>
</table>

如何显示具体细节..是否有任何可能的解决方案。?? 提前谢谢

Answer 1

试试这个：

<tr *ngFor = "let item of result">
    <td>{{item.Name}}</td><td>{{item.type[0].test1}}</td><td>{{item.type[0].test2}}</td>
</tr>

你可以迭代'result'属性，然后为每个条目打印.Name，然后打印.type [0]中的.test1和.test2（因为type属性是一个数组）。

更新：如果你只想在模板中显示一些元素，一个选项是过滤组件中的数组（在示例中，只返回那些白色名称等于'aa'）。

this.result = data.filter( item => item.Name === 'aa')

使用Url获取嵌套的Json值

1 个答案: