如何在角度模板中顯示JSON Web響應？

Question

我正在嘗試顯示HTTP Web響應附帶的一些JSON數據，但是它不起作用。

以下是我的http請求：

nodes: any;

ngOnInit(): void {
    // Make the HTTP request:
    this.http.get('/assets/TEST.json').subscribe(data => {
        // Read the result field from the JSON response.
        this.nodes=data;
    });
}

這是模板：

<div *ngFor="let node of nodes">
    <p>{{node.description}}</p>
</div>

這是我的json數據：

{
    "id": 1,
    "name": "root1",
    "link": "/login"
}

這是我在控制台中得到的錯誤：

找不到類型為“ root1”的其他支持對象“ [object Object]”，其中root1是與發出請求的組件不同的組件。

Answer 1

首先，您的JSON是一個對象，而不是數組。 因此，您不能使用ngFor 。 由於您的對象沒有description屬性（而是name ），因此可以使用以下模板顯示名稱（確保已設置節點）：

<p *ngIf="nodes">{{ nodes.name }}</p>

Answer 2

經過我們的評論調查后，解決方案：

• *ngFor不應在此處使用，因為他的JSON是對象而不是數組

所以解決方案很簡單：

<p> id : {{nodes.id}}</p>
<p> name : {{nodes.name}}</p>
<p> link : {{nodes.link}}</p>