失敗JSON

的閱讀對象類型我有我不能讀JSON的對象類型...失敗JSON

這是我的JSON：

body: { 
    "111": { 
     "name": "name1", 
     "status": 10000 
    }, 
    "222": { 
     "name": "name2", 
     "status": 20000 
    }, 
    "333": { 
     "name": "name3", 
     "status": 30000 
    } 
}

，我想知道如何呈現在我的HTML？

這是我的嘗試：

<md-content> 
    <h1 align="center">{{title}}</h1> 
    <h2>list of items:</h2> 
    <div class="list-bg" *ngFor="#item of items | async"> 
     ID: {{item.name}} <p></p> Number of Items: {{item.status}} 
    </div> 
</md-content>

不僅在於它dosent工作，即時通訊試圖找出如何讀取每行的對象ID的（那些：111，222，333）

這是我的模型：

export interface MyModel { 
     name: string; 
     status: number; 
    }

這是我的組件：

export class MyCmp implements OnInit { 
    retJson: Observable<MyModel[]> 

    constructor(private _myService: MyService) {}; 

    public showData(): void { 
     this.retJson = this._myService.getData(); 
    } 
}

謝謝！

來源

2016-07-24 jack miao

你是如何加載這個json的？ –

@NitzanTomer iv設置一個模擬文件來保存我的json，並使用http GET來檢索它，使用Observable im在我的組件中訂閱它。它適用於json的不同結構 –

然後你需要添加那段代碼（它加載json）到你的問題 –

您還沒有包括你如何加載JSON，所以我會寫一個更普遍的例子：

interface MyModel { 
    name: string; 
    status: number; 
} 

interface MyResponse { 
    body: { [id: string]: MyModel } 
} 

let response: MyResponse = JSON.parse(RESPONSE_STRING); 
Object.keys(response.body).forEach(id => { 
    let model = response.body[id]; 
    console.log(`id: ${ id }, name: ${ model.name }, status: ${ model.status }`); 
});

現在缺少的這裏是RESPONSE_STRING，這我不知道你怎麼弄。
至於模板，我不是一個角度的開發人員，但據我所知ngFor用於數組，並且你沒有在你的json結構中的數組。

來源

2016-07-24 22:11:03

ngFor循環只適用於數組。你的身體json是關鍵值對象，所以它不起作用。
如果你想它的工作，它要麼：
- 你使用一個額外的管道用管鍵值對象轉換爲數組，解決這裏討論：Iterate over TypeScript Dictionary in Angular 2，那麼你可以使用 *ngFor="let item of items | async | mapToIterable"
- 或者在您的TS文件的過程，而不是 this.retJson = this._myService.getData();它，使用this._myService.getData().subscribe(x => this.retJson = processToArray(x))

來源

2016-07-25 06:43:24 Chybie

回答

相關問題