Observable<UrlTree> 和 UrlTree 有什么区别？

Question

我正在为我的一个应用程序组件实施 canActivate 防护。

基于 documentation，UrlTree 和 Observable<UrlTree> 都是有效的 return 类型。

我知道将 'a thing' 包装到一个可观察对象中会使事情变得异步，但我不明白 router/routing 上下文中的区别。

UrlTree 和 Observable<UrlTree> 在路由器如何处理它们方面有什么区别？

你什么时候用一个代替另一个？

我假设同样的推理也适用于 <boolean> 和 Observable<boolean>

UrlTree 版本：

export class myGuard implements CanActivate {
  constructor(private router: Router) {}
  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
    return this.router.parseUrl('newRoute');
  }
}

可观察版本：

import { of } from 'rxjs';
export class myGuard implements CanActivate {
  constructor(private router: Router) {}
  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
    return of(this.router.parseUrl('newRoute'));
  }
}

两个版本我都试过了，在开发环境下都运行良好。

Answer 1

不同之处在于守卫如何处理响应类型...如果它是可观察的，它会订阅并使用订阅的值来做出路由决策。如果它不是可观察的，它只使用返回的值来做出决定。这是为了方便而不是强制你的守卫使用异步功能。

当你的决定是基于一些异步的东西...比如一个主题值或一个 http 请求或其他东西时，使用一个可观察的。当您的决定基于某些同步的东西（例如 localStorage 值或其他东西）时，请使用不可观察的。

Observable<UrlTree> 和 UrlTree 有什么区别？

What's the difference between Observable<UrlTree> and UrlTree?

angular

rxjs

observable

angular-router

angular-router-guards