Angular 4：如何在应用程序初始化时通过 REST 设置路由器配置

Question

我正在尝试根据来自 REST API 的数据设置路由器配置（包含允许的 urls 等）。在这种情况下，url /test2 应该在 HomeComponent 中结束。 Url test2 不存在于初始路由配置中，它是通过承诺添加的。

到目前为止，我使用的方法如下：

    RouterModule.forRoot([
  {
    path: '',
    component: HomeComponent
  },
  {
    path: '**',
    resolve: {
      route: RouteResolver
    },
    component: ErrorComponent
  }
])

解析器负责添加新路由的位置。

  resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<any>|Promise<any>|any {
return new Promise((resolve, reject) => { // just to fake api call
  console.log(this.router.config);
  this.router.config.push(
    {
      path: 'test2',
      component: HomeComponent
    }
  );
  this.router.resetConfig(this.router.config);
  console.log(this.router);
  resolve();
});

}

这种方法有问题，我似乎晚了一步。新路由确实被添加到路由配置中，并且配置确实被重置。但是在解析器执行期间，应用程序似乎还没有意识到这一点。所以我仍然在 ErrorComponent 结束。

知道如何完成这项工作吗？也许我在错误的区域搜索解决方案:(

Answer 1

如我的评论所述，您必须将动态路线放在通配符路线之前，然后您可以使用 Router.navigateByUrl 导航到添加的路线，但您必须检查您是否想去的路线是您动态路线的一部分。因为否则你将陷入无限循环。

我做了一个例子plunker。

注意：该示例在每次调用 CanActivate 守卫时添加路由，因此您必须在添加新路由时过滤掉现有路由。

Angular 4：如何在应用程序初始化时通过 REST 设置路由器配置

Angular 4: How to set the router config via REST on application init

router

resolver

angular