解析Angular中的JSON对象

Question

我有一个名为SampleJSON的示例JSON，如下所示：

"type1":{
"0":{"title":"Title1","url":"URL1"},
"1":{"title":"Title2","url":"URL2"},
"2":{"title":"Title3","url":"U",
    "0":{"title":"Title1","url":"URL1"},
    "1":{"title":"Title2","url":"URL2"},
    -----------------------------------,
    -----------------------------------
}
"3":{"title":"Title4","url":"URL4"},
-----------------------------------,
-----------------------------------
}

如何在Angular5中遍历节点"type1"并获取title＆amp;的值url。 在尝试ngFor之后，我陷入困境，无法继续前进。

Answer 1

您可以通过按键循环

试试这个：

https://stackblitz.com/edit/angular-y1wlkt?file=app%2Fapp.component.ts

export class AppComponent {
    name = 'Angular 5';

    test: any;
    testFinal: any[];

    constructor() {
      this.testFinal = [];
        this.test = {
            "type1": {
                "0": { "title": "Title1", "url": "URL1" },
                "1": { "title": "Title2", "url": "URL2" },
                "2": {
                    "title": "Title3", "url": "U",
                    "0": { "title": "Title1", "url": "URL1" },
                    "1": { "title": "Title2", "url": "URL2" },
                },
                "3": { "title": "Title4", "url": "URL4" }
            }
        }

        //Iterate the keys
        for(let x in this.test){

          for(let y in this.test[x]){
             this.testFinal.push(this.test[x][y]);
          }
        }
        console.log(this.testFinal)


    }
}