Question

我需要对一个可观察的观察者的结果执行一个动作。

Component

checkIn(room: Room)
{
    this.roomService.checkIn(room.number).subscribe(
        response => {
           this.checkInResponse = response;
           // other codes

           this.getRooms();

           // Perform the following line of code after getRooms() is complete, i.e. this.rooms has been reloaded. Right now, it executes instantaneously, i.e. before this.getRooms() is complete.
           this.setRoom = this.roomFromNumber(room.number);
        },
        error => {
           console.log(error);
        }
    );
 }

getRooms() {
    this.roomService.getRooms().subscribe(
      response => {
        this.rooms = response;
      },
      error => {
        console.log(error);
      }
    );
}

Service

getRooms(): Observable <any> {
    return this.http.get('http://localhost:8000/api/rooms?token=' + this.token).map(
        (response: Response) => {
            return response.json().rooms;
        });
 }

checkIn(roomNumber: number) {
    return this.http.post('http://localhost:8000/api/room/checkIn?token=' + this.token,
    {
        number: roomNumber
    },
    {
      headers: new Headers({
                'Content-Type' : 'application/json',
                'X-Requested-With' : 'XMLHttpRequest',
      })
    });
}

上面代码中的问题是this.setRoom = this.roomFromNumber(room.number);在this.getRooms()之前执行。我需要在getRooms（）完成后执行以下代码行，即this.rooms已重新加载。

我可以简单地执行以下操作，在执行代码之前等待两秒钟，如果observable在两秒钟内发生，则可以正常工作;这绝对不是正确的做法。

setTimeout(() => this.setRoom = this.roomFromNumber(room.number), 2000);

Answer 1

你可以这样做。

checkIn(room: Room)
{
    this.roomService.checkIn(room.number).subscribe(
        response => {
           this.checkInResponse = response;
           // other codes

           this.getRooms(() => { this.setRoom = this.roomFromNumber(room.number); });.

        },
        error => {
           console.log(error);
        }
    );
}

getRooms(completeAction: any) {
    this.roomService.getRooms().subscribe(
      response => {
        this.rooms = response;
      },
      error => {
        console.log(error);
      },
      () => { completeAction(); }
    );
}

Answer 2

checkIn(room: Room)
{
    this.roomService.checkIn(room.number).subscribe(
        (response) => {
           this.checkInResponse = response;
           // other codes

           this.getRooms().subscribe(
           (data) => {
               // executes after getRooms() has completed execution
               this.setRoom = this.roomFromNumber(room.number);
           },
           (error) => {
               console.log(error);
           });
        },
        (error) => {
           console.log(error);
        }
    );
}

getRooms() {
    return this.roomService.getRooms().map(
           (response) => {
                return response
            }
           ).catch((error) => {
               return Observable.throw(error)
          });
}

完成可观察完成后要执行的操作后，如何执行操作？

2 个答案: