angular - 如何完成 rxjs switchmap observable?
问题描述
我在我的 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?
解决方案
您需要finalize
在httpClient.get
. Subject 和 BehaviorSubject 在您通过调用手动完成之前不会完成subject.complete()
。但是,在发出 api 响应后完成创建的 Observable httpClient
,您需要使用它。
对于您的示例:
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))
)
)
)
推荐阅读
- java - Android 在 TextViews 中显示随机数
- julia - 具有许多功能的 Julia 函数组合
- javascript - 如何识别 Selenium 中没有标签的对象?
- android - 每当我在元数据部分添加某个库并修改 androidmanifest.xml 时,flutter 应用程序都会崩溃
- node.js - Firebase 将字符串转换为时间戳
- oracle - Oracle:动态查询:ORA-01704:字符串文字太长
- python - 获取由代码构建的列表的索引号
- java - 与使用 int 相比,使用 length() 时 Java for 循环条件的行为不同
- ajax - Codeigniter如何在没有输入类型文本和输入帖子的情况下接收控制器中的ajax帖子数据
- android - 使用 Flutter 从方法中获取一些变量值