为什么 console.log 打印多次

Question

嗨，我是 Rxjs 及其运算符的新手。

我很难理解下面的代码

canActivate(route: ActivatedRouteSnapshot): Observable<boolean> {
        const id = route.paramMap.get('id');

        console.log('Entered in Can-Activate');
        return this.store.select(policy)
            .pipe(
                tap(policy => {
                    console.log('-------------------' + JSON.stringify(policy));
                    if (policy.model.id !== id && policy.meta.loading !== 'progress') {
                        console.log('--------------dispaching-----');
                        this.store.dispatch(new Load(id));
                    }
                }),
                filter(policy => (
                    policy.model.id === id &&
                    (policy.meta.loading === 'done' || policy.meta.loading === 'failed')
                )),
                map(s => s.meta.loading ==='done'),
                take(1)
            );
    }

控制台的输出是

Entered in Can-Activate
-------------------{"meta":{"loading":"start".........}
-------------------{"meta":{"loading":"progress".........}
-------------------{"meta":{"loading":"done".........}

任何人都可以解释为什么下面的行在函数只调用一次时执行了多次？ console.log('----------------' + JSON.stringify(策略));

是因为ngrx store还是RxJS算子？

Answer 1

this.store.select 是可观察的。每次状态改变时，它都会发出一个新值，并且 tap 中的逻辑将被执行，直到取消订阅。

如果您满足以下条件，

 policy.model.id === id &&
                    (policy.meta.loading === 'done' || policy.meta.loading === 'failed')

为什么 console.log 打印多次

why the console.log prints multiple times

rxjs

ngrx

angular

ngrx-store

rxjs6