angular - 为什么 .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;
}
} ))
也许我应该对它的工作方式感到满意,但我不明白为什么这里需要管道。任何人都会有几分钟的时间向我解释这一点?
非常感谢 !纳内克斯
解决方案
使用最新版本的 rxjs (6),链式地图操作符已被移除。这是为了增加对库进行树摇动的能力。现在您必须使用pipe
运算符。
用于点链的修补运算符的问题是:
任何导入补丁操作符的库都会为该库的所有使用者增加 Observable.prototype,从而创建盲依赖。如果图书馆取消了它们的使用,它们会在不知不觉中破坏其他所有人。使用 pipeables,您必须将所需的运算符导入到您使用它们的每个文件中。
直接修补到原型上的算子不能被 rollup 或 webpack 等工具“摇树”。可管道运算符将是因为它们只是直接从模块中提取的函数。
任何类型的构建工具或 lint 规则都无法可靠地检测到正在导入应用程序的未使用运算符。这意味着您可能会导入扫描,但停止使用它,它仍会被添加到您的输出包中。使用 pipeable 运算符,如果您不使用它,lint 规则可以为您提取它。
功能组合很棒。构建自己的自定义运算符变得非常容易,现在它们可以工作并且看起来就像 rxjs 中的所有其他运算符一样。您不再需要扩展 Observable 或覆盖提升。
推荐阅读
- regex - 正则表达式:组的匹配补码
- php - 全部重写为 1 个域,Joomla 管理员除外
- mysql - 在 MySQL 中创建存储过程时出现错误 1064 (42000)
- amazon-web-services - 打包程序“source_ami_filter”中的“所有者”字段有什么作用?
- asp.net-core - 如何从 Blazor WASM 中的类调用 StateHasChanged() / NotifyAuthenticationStateChanged
- python - 熊猫数据框保留满足某些条件的行,否则保留任何可用的
- vue.js - 如何翻译 Quasar 组件?
- excel - 使用vba删除列表框中的选定项目
- web-scraping - 如何更新 python 抓取的有效负载信息
- javascript - 无法使用 web3.eth.accounts.wallet.encrypt