rxjs中的可重用运算符

时间:2018-04-17 04:02:25

标签: javascript angular rxjs

基本上,我有这种逻辑在所有解析器中都是一样的。我有问题让它可以重复使用其他解析器。

这是我的例子:

// fetch-abc.resolver.ts
@Injectable()
export class FetchAbcResolver implements Resolve<any> {

    constructor(private route: Router,
                private ngProgress: NgProgress,
                private abcService: AbcService) {
    }

    resolve = (activateRoute: ActivatedRouteSnapshot) => {

        this.ngProgress.start()

        const slug: string = activateRoute.paramMap.get('slug')

        return this.abcService.fetchAbc(slug)
                   .delay(1000)
                   .finally(() => this.ngProgress.done())
                   .catch(error => {
                       this.route.navigate([ '/404', {
                           err: 'Error',
                           msg: `Could not find ${slug}`, error
                       } ])

                       return Observable.empty()
                   })
    };
}

如何使.delay.finallycatch可重复使用。

我目前的工作正在进行中

// rxjs.apply.ts
import { Observable } from 'rxjs/Observable'

function apply(functions: Array<Function>) {
    functions = [].concat(functions);

    return functions.reduce((observable, func) => func(observable));
}

Observable.prototype.apply = apply

declare module 'rxjs/Observable' {
    interface Observable<T> {
        apply: typeof apply;
    }
}

但我坚持如何结合运算符

1 个答案:

答案 0 :(得分:2)

如果您正在使用RxJS 5.4和patch样式的运算符,则可以使用let并创建一个函数,该函数将您想要的参数设置为可配置并附加所需的链:

const myChain = (x, y) => 
  source => 
    source.delay(x)
      .finally(() => console.log(y))
      .catch(error => Observable.empty());

Observable.of(42)
  .let(myChain(1000, 'a'))
  .subscribe(console.log);

查看现场演示:https://stackblitz.com/edit/rxjs5-zytoqb?file=index.ts

其中myChain是一个返回附加运算符的函数的函数。当我在不使用箭头函数的情况下添加括号时,它可能更明显:

function myChain(x, y) {
  return function(source) {
    return source.delay(x)
      .finally(() => console.log(y))
      .catch(error => Observable.empty());
  };
};