专栏首页Jerry的SAP技术分享Angular rxjs里自定义operator的使用

Angular rxjs里自定义operator的使用

操作符是函数,它基于当前的 Observable 创建一个新的 Observable。这是一个无副作用的操作:前面的 Observable 保持不变。

操作符本质上是一个纯函数 (pure function),它接收一个 Observable 作为输入,并生成一个新的 Observable 作为输出。

看个例子:

ngOnInit(): void {
    // input has type observable
    function multiplyByTen(input) {
      return new Observable(function subscribe22anyname(observer) {
        input.subscribe({
          next: (v) => observer.next(10 * v),
          error: (err) => observer.error(err),
          complete: () => observer.complete()
        });
      });
    }
    const inpute = from([1, 2, 3, 4]);
    const output = multiplyByTen(inpute);
    output.subscribe(x => console.log(x));
  }

调用我自定义的Operator multiplyByTen, 返回一个新的Observable实例:

在Observable的构造函数里,将应用程序传入的subscribe方法传入并维护到_subscribe方法里:

sink.add方法里调用应用程序编写的回调:

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • rxjs 里的pipe operator

    注意,传入pipe的operations不是应用程序传入的fn,而是执行了map operator后,被MapOperation包裹过的fn:

    Jerry Wang
  • rxjs里concatMap operators的用法

    将source Observable里的每个元素施加一个projection函数,这个projection函数返回一个新的Observable,然后将所有这些O...

    Jerry Wang
  • rxjs里concat operators的用法

    concat接受多个Observable作为参数,在同一个时间点subscribe这些Observable,将其结果合并到一个新的output Observab...

    Jerry Wang
  • .NET Core 3.0 构建和部署

    在 dotnet build 或 dotnet publish 期间,将创建一个与你使用的 SDK 的环境和平台相匹配的可执行文件。 和其他本机可执行文件一样,...

    solenovex
  • XenDesktop 5 修改XML端口

    在XenDesktop 4中,我们要修改XML端口可以使用ctxxmlss命令来修改XML服务的端口,而在XenDesktop 5中由于对架构和细节做完全的修...

    SuperDream
  • [机器学习算法]支持向量机

    在样本空间中找到一个划分超平面,将不同类别的样本区分开。但是事实上,能将训练样本划分开的超平面可能有很多,如下图所示,我们的任务就是寻找到最优的划分超平面。

    TOMOCAT
  • 小程序 · 一周报

    提前发起授权请求不再支持获取用户信息。为了优化用户的使用体验,开发者需要使用组件方式,在用户点击后唤起登录授权弹窗。

    极乐君
  • 通过视频上云网关EasyNTS进行端口穿透时显示【端口不存在】【端口已被占用】信息的原因解析

    由于很多视频监控搭建现场的设备都没有公网IP,而又希望进行公网直播,所以TSINGSEE青犀视频团队研发EasyNTS最大的作用就是解决了网络穿透的问题,实现设...

    EasyNVR
  • 「击败星际争霸II职业玩家」的 AlphaStar是在作弊?

    「DeepMind 击败人类职业玩家的方式与他们声称的 AI 使命,以及所声称的『正确』方式完全相反。」

    昱良
  • Node.js 事件循环完整指南[每日前端夜话0x9F]

    Complete Guide To The Event Loop In Node.js

    疯狂的技术宅

扫码关注云+社区

领取腾讯云代金券