Question

当我想通过订阅HTTP请求为Angular组件中的局部变量赋值时我不确定

  patient: Patient;
  hpId: any;
  ngOnInit() {
    const id = +this.route.snapshot.paramMap.get('id');
    this.fetchPatient(id);
    console.log(this.hpId);
  }
  fetchPatient(id: number) {
    this.patientService.getPatient(id)
    .subscribe( data => {
      this.patient = data;
      this.hpId = this.patient.appointment[0].healthProfessionalId;
    });
  }
}

我要使用hpId的值超出预订方法的范围

Answer 1

有两种方法：

1）如果要在HTML页面中显示hdId，请使用类似{{ hpId }}

2）如果要调用另一个API，则可以将该调用包装在.subscribe()调用中，例如

fetchPatient(id: number) {
    this.patientService.getPatient(id)
    .subscribe( data => {
      this.patient = data;
      this.hpId = this.patient.appointment[0].healthProfessionalId;
      this.yourMethod(this.hdId); // here
    });
}

yourMethod(hdId){
     console.log(hdId);  // do whatever with `hdId`
}

Answer 2

打字稿中的编码就像管道。.您必须像流。如果您打开水龙头，但是如果水一直流到水面，点击那里不会有水，所以如果您打算洗衣服，就必须这样做水从水龙头流出后。
因此，当您调用方法this.fetchPatient（id）;它将击中后端并在订阅中等待，直到获取数据或错误。之后 this.fetchPatient（id）;然后你把你的console.log（this.hpId）; 此时未检索到数据，但因此进行了呼叫它将显示未定义。如果您想查看数据，请输入控制台日志内部订阅此行之后this.hpId = this.patient.appointment [0] .healthProfessionalId;
此外，如果要在其他方法中使用this.hpId的值
在this.hpId =
之后调用这些方法 this.patient.appointment [0] .healthProfessionalId;线。

通过订阅可观察的HTTP请求将值分配给角度分量中的变量

2 个答案: