Question

我像这样设置路由

{
     path: ':parent', component: ParentComponent,
     resolve: { data: ParentResolve },
     children: [
         {
              path: ':child', component: ChildComponent,
              resolve: {
                   data: ChildResolve
              }
         }
}

当我将我的网址从/:parent/:child更改为/:parent时，一切正常。我想重定向到子路由，param来自ParentResolve。

我的问题：当我手动更改网址时，Angular不会调用Resolve guard，因此我无法重定向到子路由。

请问我是否不清楚，谢谢。

Answer 1

路由器配置中的'resolve'部分在激活之前处理所有路由获取。这意味着当你从任何其他路线进入这条路线而不是来自它自己的孩子时会被呼叫（因为路线已被激活）。

我认为解决此问题的最佳方法是将路径更改事件侦听器添加到ParentComponent并在那里处理它。

尝试这样的事情：

export class ParentComponent implements OnInit, OnDestroy {
  routeEventSubscription$;
  routerData;
  constructor(private activatedRoute: ActivatedRoute,
              private router: Router) {
    this.name = `Angular! v${VERSION.full}`
  }

   ngOnInit() {
    this.subscribeToRouteChange();
  }

  subscribeToRouteChange(){
    this.routerData=this.activatedRoute.snapshot.params['data'] //Your router resolver data.
    this.routeEventSubscription$ = this.router.events
      .filter(event => event instanceof NavigationStart) //Subscribe only to NavigationStart event
      .subscribe(event => {
        this.routeToChild();
      });
  }

  routeToChild(){
    /**
     * Add your logic here.
     * Use this.routerData as you.
     */
  }



  ngOnDestroy(){
    //Dont forget to unsubscribe routeEventSubscription$!
    this.routeEventSubscription$.unsubscribe();
  }
  }

您可以详细了解路线数据解析here和here

触发保护以在通过浏览器手动更改URL时重新呈现组件

1 个答案: