Question

我目前遇到一个简单的问题。我有一个名为UserService的服务，旨在成为一个API层。我想以这种方式调用它的方法getProfile()：

如果是第一次调用该方法，它将向我的API请求检索配置文件，它将保存到变量中，然后以Observable的形式将其返回到调用它的组件。
如果该变量已包含其中的配置文件，则返回该配置文件，以避免不必要的网络开销。

我尝试过不同的方法，但不能完全正常工作（我是Angular和rxjs的新手）。

这是我到目前为止所做的。

来自getProfile()的

UserService方法：

public getProfile(): Observable<any> {
if (this.profile) {
  return Observable.of(this.profile);
} else {
  this.http.get(URLS.URL_GET_PROFILE,
    { headers: this.authZeroService.getAuthorizationHeaders() })
    .subscribe(res => {
      this.profile = res.json().user.profile;
      return Observable.of(this.profile);
    });
  }
}

然后从配置文件组件中调用它：

userService.getProfile().subscribe(profile => {
  console.log(profile);
});

Answer 1

将个人资料保存在服务的主题中：

export class ProfileService{

    private $profile: Subject<Profile> = new Subject();

    //fetch it the first time.
    contructor(http: HttpClient){
        this.http.get<Profile>('some_url).subscribe(res => {
            this.$provile.next(res);
        });
    }

    //The get the profile for you app:
    public getProfile(): Observable<Profile> {
        return this.$profile.asObservable();
    }

}

Answer 2

我终于以非常类似的方式工作，我认为可以做到。我知道有更好更简单的方法来做同样的事情。

来自UserService的类变量：

private profile: any;
private profile$: Observable<any>;

getProfile()方法：

public getProfile(): Observable<any> {
if (this.profile) {
  return Observable.of(this.profile);
} else if (this.profile$) {
  return this.profile$
} else {
  this.profile$ = this.http.get(URLS.URL_GET_PROFILE,
    { headers: this.authZeroService.getAuthorizationHeaders() })
    .map(res => {
      this.profile$ = null;
      this.profile = res.json().user.profile;
      return this.profile;
    })
    .share();
  return this.profile$;
  }
}

然后只需从任何组件订阅。此解决方案基于此https://stackoverflow.com/a/36291681/7048554

从API获取用户配置文件。对象与可观察对象

2 个答案: