Angular 4: Как настроить конфигурацию маршрутизатора через REST при запуске приложения

Question

Я пытаюсь установить конфигурацию маршрутизатора (содержащую разрешенные URL и т. Д.) На основе данных из REST API. В этом случае URL / test2 должен оказаться в HomeComponent. Url test2 отсутствует в исходной конфигурации маршрута, он добавляется обещанием.

До сих пор я использовал следующий подход:

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

Где Resolver отвечает за добавление новых маршрутов.

  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 чтобы перейти к добавленному маршруту, но вы должны проверить, является ли маршрут, по которому вы хотите идти, частью ваших динамических маршрутов. Потому что в противном случае вы бы оказались в бесконечном цикле.

Я сделал вантуз с примером.

Примечание. В этом примере маршруты добавляются каждый раз, когда CanActivate Вызывается guard, поэтому вы должны отфильтровать существующие маршруты при добавлении новых.