使用 RxJS 从 HTTP 请求在 Angular 组件之间传递数据的正确方法是什么?

What is the correct way to pass data between Angular components from an HTTP request using RxJS?

我正在尝试为一个项目创建一个登录系统,我有一个身份验证服务、令牌服务和我的登录组件,我刚开始使用 RxJS,所以这很可能是一个非常愚蠢的问题。

我的设计是让令牌服务获取令牌并使用我的后端进行 HTTP 请求,将信息传递到将确定用户是否已成功登录的身份验证服务,然后将其传递回到登录组件,这将阻止允许用户进一步进入网站。

代码在我的令牌服务中是这样的:

getToken() : any {
   return this.http.get(this.SERVER.HREF + query, requestOptions).share();
}

makeRequest() : any {
   let obsv = getToken();
   obsv.subscribe((res: Response) =>) {
     let token = res.json().data.token;
     this.http.get(this.SERVER.HREF + query, requestOptions).share(); 
     // above is that Observable that returns the data that I would like to
     // pass back to auth-service
   }
}

auth-service被注入到login-component中,token-service被注入到auth-service中。如何获取我对 auth-service 的请求的结果,以便它可以解析它并将 return 布尔值传递给登录组件?

您的令牌服务

getToken() : any {
   return this.http.get(this.SERVER.HREF + query, requestOptions);
}

makeRequest() : any {
  return this.getToken().switchMap(()=>{
     return this.http.get(this.SERVER.HREF + query, requestOptions)
});

}

您的身份验证服务,假设您已将令牌服务注入为 _tokenService

this._tokenService.makeRequest().subscribe(console.log)