如何完成 rxjs switchmap observable？

Question

我的 angular 8 项目中有一个 observable，并在 ngOnInit() 中订阅。

     export class ChartComponent implements OnInit {
       urlSubject: Subject<string> = new Subject();
       isLoading: BehaviorSubject<boolean> = new BehaviorSubject(false);
       chartData: BehaviorSubject<any[]> = new BehaviorSubject<any[]>([]);
       dataSubscription: Subscription;

       dataObservable: Observable<any> = this.urlSubject.pipe(
         switchMap((url: any) => this.httpClient.get<any[]>(url))
       )

       ngOnInit() {
         this.dataSubscription = this.dataObservable
          .pipe(tap(() => this.isLoading.next(true)))          
          .pipe(map((response: any) => response.result))      
          .subscribe((response: any) => this.chartData.next(response),
            () => this.isLoading.next(false),
            () => this.isLoading.next(false));

         this.urlSubject.next(this.data.settings.dataEndpoint)
      }
}

但是 complate 方法不会触发订阅。

我正在订阅 chartData 类型是 BehaviourSubject。所以我不订阅urlSubject。因为 url 可能会随时更改搜索或过滤器参数。

我正在使用 finilize，但它不起作用。我认为这个问题是关于 switchmap 内部孔隙的。如何完成并将加载设置为 false？

Answer 1

如上所述，主题永远不会完成，除非您调用 subject.complete();

话虽如此，主题是可观察的，您可以随时使用 take(COUNT) 或 takeUntil 运算符等取消订阅它们....

Answer 2

您需要在 httpClient.get 上使用 finalize。 Subject 和 BehaviorSubject 在您通过调用 subject.complete() 手动完成之前不会完成。然而，由 httpClient 创建的 Observable 在发出 api 响应后完成，您需要使用它。

以你的例子为例：

dataObservable: Observable<any> = this.urlSubject.pipe(
  tap(() => this.isLoading.next(true)),
  switchMap((url: any) =>
    this.httpClient.get<any[]>(url).pipe(
      finalize(() => this.isLoading.next(false))
    )
  )
)

如何完成 rxjs switchmap observable？

How to finilize rxjs switchmap observable?

angular

rxjs

angular8

rxjs-observables

switchmap