发出HTTP请求时,RxJS订阅如何工作?

时间:2020-07-16 17:31:02

标签: angular typescript http rxjs

  export class VendorHttpService {
  result = '0';
  constructor(private http: HttpClient, private global: GlobalService) { }

  getProfileStatus(uid: String): string {
    this.http.get(this.global.getUrl()+"/vendor/profile-status/"+uid).subscribe(
      (val: number) => {
        this.result = String(val);
        console.log("got executed "+this.result)
      }, error => {
        //console.log("error")
        this.result = error;
      }
    );
    return this.result;
  }
}

因此,从Angular 8中的上述代码中,您可以看到我正在使用 RxJS 向服务器发出HTTP请求,但是在方法内部,我想从请求中返回值而不是整个 RxJS订阅。如您所见,我已经声明了一个名为 result 的变量,我正在方法内部对其进行更新,然后将其返回,但是当我在组件中调用此方法 getProfileStatus()时,初始值为0。

我不明白为什么它没有更新?我想知道RxJS在 Subscribe()方法中的行为方式。

Subscribe()完成任务之前,方法 getProfileStatus()返回了吗?

请放心,我已经从服务器和数据库端检查了所有内容,一切正常。

1 个答案:

答案 0 :(得分:3)

是的,getProfileStatus()在Subscribe()完成其任务之前返回。 订阅时,您将触发请求,并让浏览器知道答案到达后,它必须使用您提供的功能来处理它。然后,它仅继续进行下几行,但是订阅中的函数正在等待执行。 我建议这样做的方法是返回可订阅的而不是值,并从您的组件进行订阅。因此,这将为您服务:

  getProfileStatus(uid: String): Observable<string> {
    return this.http.get(this.global.getUrl()+"/vendor/profile-status/"+uid)
  }

在您的组件中应该有以下内容:

constructor(private vendorHttp: VendorHttpService){}

functionName() {
  this.vendorHttp.getProfileStatus("some_uid").subscribe(
      (val: number) => {
        this.result = String(val);
        console.log("got executed "+this.result)
      }, error => {
        //console.log("error")
        this.result = error;
      }
  );
}