typescript 路由器getCurrentNavigation始终仅在升级到Angular 15后返回null

dced5bon  于 2022-12-19  发布在  TypeScript
关注(0)|答案(1)|浏览(120)

此问题仅在升级到angular 15后出现,我正在向路由器传递一个状态属性,但此.router.getCurrentNavigation()返回一个空值,该值已由另一组件中的router.navigate传递
组分A:

组分B:

我可以使用this.state = history.state;访问组件B中的状态,但this.state = this.router.getCurrentNavigation()?.extras?.state ?? {};不起作用,它说getCurrentNavigation()返回null。这是为什么?

new9mtju

new9mtju1#

我们在升级到Angular 15时遇到了同样的问题。我们通过添加一个新的解析器解决了这个问题。这个解析器可以使用getCurrentNavigation()访问当前路由,因此可以将“额外”数据返回给组件。

@Injectable()
export class MyComponentResolver implements Resolve<MyComponentExtraData> {
  constructor(private router: Router) {
  }

  resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): MyComponentExtraData{
  
    return this.router.getCurrentNavigation().extras?.state['MyData'];
  }
}

然后,您可以使用activatedRoute.snapshot字典访问组件构造函数中解析器返回的数据,而不会出现任何问题。

constructor(private activatedRoute: ActivatedRoute) {
 
    let myData = this.activatedRoute.snapshot.data['myData'] /* the myData key depends on how you defined the resolver in your route declaration*/
  }

相关问题