zoukankan      html  css  js  c++  java
  • RxJS之工具操作符 ( Angular环境 )

    一 delay操作符

    源Observable延迟指定时间,再开始发射值。

    import { Component, OnInit } from '@angular/core';
    import { of } from 'rxjs/observable/of';
    import { delay } from 'rxjs/operators/delay';
    
    @Component({
      selector: 'app-util',
      templateUrl: './util.component.html',
      styleUrls: ['./util.component.css']
    })
    export class UtilComponent implements OnInit {
    
      constructor() { }
    
      ngOnInit() {
        console.log(new Date());
        of('Mike', 'Leo').pipe(delay(1000))
          .subscribe(val => {
            console.log(new Date(), val);
          });
      }
    }

    二 do/tap操作符

    do、tap ( 窃听 ) 是两个完全相同的操作符,用于窃听Observable的生命周期事件,而不会产生打扰。

    import { Component, OnInit } from '@angular/core';
    import { of } from 'rxjs/observable/of';
    import { tap } from 'rxjs/operators/tap';
    
    @Component({
      selector: 'app-util',
      templateUrl: './util.component.html',
      styleUrls: ['./util.component.css']
    })
    export class UtilComponent implements OnInit {
    
      constructor() { }
    
      ngOnInit() {
    
        // tap在subscribe之前执行
        of('Mikey', 'Leo').pipe(
          tap(
            val => {
              console.log('tap next', val);
            },
            null,
            () => {
              console.log('tap complete');
            }
          )
        )
          .subscribe(
            val => {
              console.log('subscribe next', val);
            },
            null,
            () => {
              console.log('subscribe complete');
            }
          );
    
        // 没有订阅,tap不执行
        of('Raph', 'Don').pipe(
          tap(
            val => {
              console.log('tap next', val);
            },
            null,
            () => {
              console.log('tap complete');
            }
          )
        );
      }
    }

  • 相关阅读:
    原生js设置cookie
    vuex数据持久化存储
    export和export default的区别
    userAgent判断是微信还是企业微信
    SVN的使用方法
    Js字符串反转
    通用JS10——一元加和减
    通用JS十——递增/递减操作符
    通用JS9
    @SuppressWarning注解用法
  • 原文地址:https://www.cnblogs.com/sea-breeze/p/8977459.html
Copyright © 2011-2022 走看看