使用tap()而不是map()rxjs和angular

我有一个登录保护,它基本上检查用户IL是否登录。如果他被记录,它会跳过登录并转到主页。我写了这段代码,这段代码可以:

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
    return this.store.select(fromApp.isAuthenticated)
        .pipe(take(1),
            map(isAuthenticated => {
                if (isAuthenticated) {
                    this.router.navigate(['/home']);
                    return false;
                } else {
                    return true;
                }
            })
        )
}

现在,由于我不必更改或编辑输出数据(经过验证的布尔值),我想:那么,为什么不使用tap操作符呢?所以,我重新编写代码:

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
    return this.store.select(fromApp.isAuthenticated)
        .pipe(take(1),
   HERE------> tap(isAuthenticated => {   <------ HERE
                if (isAuthenticated) {
                    this.router.navigate(['/home']);
                    return false;
                } else {
                    return true;
                }
            })
        )
}

然后我去了Chrome,我看到了黑色的页面,情况就是这样:

• 我打开应用程序
• 我没有登录
• URL变成 http://localhost:4200/#/ 而不是 http://localhost:4200/#/login ,结果:空白页
• 如果我试着手动进入 http://localhost:4200//登录 ,它留在里面 那一页,但我看到一个空白页
• 如果我想回家,它会重新定向 网址:http://localhost:4200/#/ 相反 属于 http://localhost:4200//登录

无论如何,我看到的都是空白页。所以,我进入调试阶段,注意到它正确地跳转到if/else块中…那么,为什么tap()会破坏应用程序?