JSON 在 angular 前端

Question

嗨，有人可以帮我在前端 angular（如树或扩展）中显示我的 json

这是我的后端 JSON 它是按校园分组的建筑物数组制作关系 mongodb 数据库。

    [
{
"_id": "campus4",
"buildings": [
{
"buildingName": "building7",
"phoneNumber": "00000000000"
},
{
"buildingName": "building8",
"phoneNumber": "000000000"
},
{
"buildingName": "building9",
"phoneNumber": "0000000000"
}
]

我得到服务：

  getBuildings() {
    return this.http.get(`${this.url}/buildings`);
  }

我的 buildinglist.component.ts :

    ngOnInit() {
  this.fetchBuildings();
}

fetchBuildings() {
  this.gesroomService
    .getBuildings()
    .subscribe((data: Building[]) => {
      this.buildings = data;
      console.log('Building data requested...');
      console.log(this.buildings);
    });
}

Answer 1

您可以遍历第一个数组，访问 _id。然后你可以遍历 buildings list.

像这样的东西应该可以工作

<div *ngFor="let bList of buildings">

    <div>_id: {{ bList._id }}</div>
    <div *ngFor="let b of bList.buildings">
         <div>buildingName: {{ b.buildingName }}</div>
         <div>phoneNumber: {{ b.phoneNumber }}</div>
    </div>

</div>

JSON 在 angular 前端

JSON in angular frontend

angular

mongodb

angular-forms