首页 > 解决方案 > 为什么 .map 运算符在没有 .pipe (Angular + Angularfire2/auth) 的情况下无法工作?

问题描述

我已经在调用 AngularFireAuth 的 authState 方法的路由之一中实现了一个 Auth 保护。

我已经看到很多像下面这样授予访问权限的示例:

return this.afAuth.authState.map(user => {
       if(isNullOrUndefined(user)){
        this.router.navigate(['auth/login']);
        return false;
       }else{
         return true;
       }
     })

但是当我尝试按原样复制它时,我收到以下错误:'...Property 'map' doesn't exist on type 'Observable'。

但是当我包含 .pipe 时,它​​按预期工作:

return this.afAuth.authState.pipe(map((user) => {
       if(isNullOrUndefined(user)){
        this.router.navigate(['auth/login']);
        return false;
       }else{
         return true;
       }
     } ))

也许我应该对它的工作方式感到满意,但我不明白为什么这里需要管道。任何人都会有几分钟的时间向我解释这一点?

非常感谢 !纳内克斯

标签: angularfirebasefirebase-authenticationangularfire2auth-guard

解决方案


使用最新版本的 rxjs (6),链式地图操作符已被移除。这是为了增加对库进行树摇动的能力。现在您必须使用pipe运算符。

你可以在这里这里阅读更多

用于点链的修补运算符的问题是:

任何导入补丁操作符的库都会为该库的所有使用者增加 Observable.prototype,从而创建盲依赖。如果图书馆取消了它们的使用,它们会在不知不觉中破坏其他所有人。使用 pipeables,您必须将所需的运算符导入到您使用它们的每个文件中。

直接修补到原型上的算子不能被 rollup 或 webpack 等工具“摇树”。可管道运算符将是因为它们只是直接从模块中提取的函数。

任何类型的构建工具或 lint 规则都无法可靠地检测到正在导入应用程序的未使用运算符。这意味着您可能会导入扫描,但停止使用它,它仍会被添加到您的输出包中。使用 pipeable 运算符,如果您不使用它,lint 规则可以为您提取它。

功能组合很棒。构建自己的自定义运算符变得非常容易,现在它们可以工作并且看起来就像 rxjs 中的所有其他运算符一样。您不再需要扩展 Observable 或覆盖提升。


推荐阅读