Question

我有一个数据，看起来像这样 My data

目前，我正在浏览这样的数据

this.arr = Object.keys(data).map(k => data[k].rName);

因此，我获得了rNames的列表，并在我的html中显示ngFor。

  <mat-card *ngFor="let room of arr">
    <mat-card-content>

      <h3>Room Number: {{room}}</h3>
      <button (click)="next()">Info</button>

    </mat-card-content>
  </mat-card>

现在我想做一些小改动，我想制作一个rnames和floorfCodes数组，就像这样 [{rname1, floorCode1}, {rname2, floorCode2}]等，循环浏览名称，如果单击按钮，则将floorCode传递到下一页。

所以，我的路由功能会像这样工作：

  next() {
    this.router.navigate(['roomdetail', this.buildingID, this.floor ]);
  }

我的问题是：如何检索数据（对象数组）以及如何在按钮中访问它，以便将数据传递给路由器？

Answer 1

你可以做一个BehaviourSubject：

在您的服务上，您将初始化它：

export class RoomService {
  _roomBehaviour: BehaviorSubject<RoomResponse>;
  _roomList: RoomResponse;
  construct(){
    this._roomList = new RoomResponse();
    this._roomBehaviour = new BehaviorSubject<RoomResponse>(this._roomList);
    this.updateRoomList();
  }

  getRoomList () {
    return this._roomBehaviour;
  }

  updateRoomList () {
    this.http.get<RoomResponse>(
      'url',
      'headers').subscribe(response => {
        this._roomBehaviour .next(response);
    });
  }
}

而不是

this.arr = Object.keys(data).map(k => data[k].rName);

您可以通过致电客房服务来检索您的数据。

this.roomService.getRoomList();

由于在初始化Object时它已经检索了一次数据，因此它会传递保存的值。

如何从json中检索数据，循环遍历它并将其用作Angular中路由器中的参数

1 个答案: