Question

我们有一个带Redux的Angular 4应用程序（ngrx 4）。

我们保留信息＆＃34; isLoggedIn＆＃34;在ngrx / store中，当我们发出对http的调用时，我们首先要检查他是否经过身份验证。

我们正在努力解决的问题是实现http调用的服务：

export class GetDataFromREST() {

     constructor(private http: HttpClient, private loginStore: Store) {
          this.loggedIn$ = this.loginStore.select(getLoggedIn);
     }
     ...
     public getProducts(): Observable<ProductList> {

          return /*observable that returns http.get(api) only 
                   after the loggedIn$ emits true */
     }
}

请注意，登录不应该是服务的一个问题 - 一旦登录它应该执行从它询问的所有呼叫。

有什么想法吗？

Answer 1

这将达到您要求的结果。

export class GetDataFromREST() {

     constructor(private http: HttpClient, private loginStore: Store) {
          this.loggedIn$ = this.loginStore.select(getLoggedIn);
     }
     ...
     public getProducts(): Observable<ProductList> {

          return this.loggedIn$.filter(Boolean).take(1).subscribe(
            () => http.get(api)
          )
     }
}

Answer 2

由于loggedIn$已经是一个Observable，你可以重播它的最后一个值并将其用作将与远程调用合并的源Observable：

this.loggedIn$ = this.loginStore.select(getLoggedIn)
  .publishReplay(1)
  .refCount();

...

public getProducts(): Observable<ProductList> {
  return this.loggedIn$
    .mergeMap(() => http.get(api));
}

所以getProducts()在this.loginStore.select(getLoggedIn)发出之前不会发出任何内容。

同样，当您稍后致电getProducts()时，this.loggedIn$中的最新值将被重播，因此它会立即运行远程呼叫。

Answer 3

使用CombineLatest运算符将log in observable与get api observable相结合，然后您可以按登录状态进行过滤

http://reactivex.io/documentation/operators/combinelatest.html http://reactivex.io/documentation/operators/filter.html

有条件地发出可观察的

3 个答案: