如何取消Angular rxjs Observable的订阅

简介: 如何取消Angular rxjs Observable的订阅

源代码:

ngOnInit(): void {
     const ob = new Observable(function subscribe(observer) {
      // 追踪 interval 资源
      const intervalID = setInterval(() => {
        observer.next('hi');
      }, 1000);
      // 提供取消和清理 interval 资源的方法
      return function jerryunsubscribe() {
        debugger;
        clearInterval(intervalID);
      };
    });
    const jerry = ob.subscribe((x) => console.log(x));
    jerry.unsubscribe();
  }

在Observable的subscribe方法执行时,会进行取消即unsubscribe的注册:

image.pngimage.png直接call 之前调用subscribe方法返回的对象的unsubscribe方法即可取消订阅:

image.png

相关文章
|
8月前
|
JavaScript Shell
使用 RxJs 实现一个支持 infinite scroll 的 Angular Component
使用 RxJs 实现一个支持 infinite scroll 的 Angular Component
31 0
|
7月前
|
UED
关于 Angular 应用里 Rxjs filter 操作符内的双重感叹号的用法
关于 Angular 应用里 Rxjs filter 操作符内的双重感叹号的用法
29 0
|
8月前
|
前端开发 容器
使用 Rxjs 解决 Angular Component 之间的通信问题
使用 Rxjs 解决 Angular Component 之间的通信问题
36 0
|
8月前
|
前端开发 API
使用 RxJs Observable 来避免 Angular 应用中的 Promise 使用
使用 RxJs Observable 来避免 Angular 应用中的 Promise 使用
65 0
|
8月前
|
JavaScript
使用 RxJS timeout 操作符给 Angular SSR 服务器端渲染模式下的 HTTP 请求添加超时机制
使用 RxJS timeout 操作符给 Angular SSR 服务器端渲染模式下的 HTTP 请求添加超时机制
70 0
|
前端开发 JavaScript API
Angular与Rxjs学习
Angular与Rxjs学习
119 0
Angular与Rxjs学习
|
JavaScript
使用 RxJS timeout 操作符给 Angular SSR 服务器端渲染模式下的 HTTP 请求添加超时机制
Angular Universal 是一个开源项目,扩展了 @angular/platform-server 的功能。 该项目使 Angular 中的服务器端渲染成为可能。
128 0
|
API 索引
理解Angular RxJS映射数据操作
Map 数据是程序开发时的一种常见操作。当在代码中使用RxJS来生成数据流时,很可能最终需要一种方法来将数据映射成需要的任何格式。RxJS提供了常规的 map 函数,还有 mergeMap、switchMap和concatMap这样的函数,它们的处理方式略有不同。
130 0
Angular 结合 rxjs 实现拖拽
在上两篇文章中,我们学习了元素中必知重要属性和方法和 Angular 中自定义 Video 操作,没有度过的读者可先了解。那么,现在有这么一个需求,你会怎么实现呢?
Angular 结合 rxjs 实现拖拽
|
测试技术 Windows
Angular Observable数据类型的单元测试数据准备
Angular Observable数据类型的单元测试数据准备
111 0
Angular Observable数据类型的单元测试数据准备