Как динамически добавить путь угловых маршрутов при отложенной загрузке на основе данных вызова API - PullRequest
Новая
       11

Как динамически добавить путь угловых маршрутов при отложенной загрузке на основе данных вызова API

1 голос
/ 10 мая 2019

Основываясь на данных входа в систему, я делаю вызов API, чтобы получить динамические маршруты, которые нужно добавить для модуля отложенной загрузки.Но навигация происходит до того, как я добавил маршруты в лениво загруженные модули.И если путь не совпадает, он должен перейти к notfoundcomponent.

Я пробовал перехватчики навигации, такие как начало навигации, конец навигации, RouteConfigLoadStart.RouteConfigLoadEnd, router.events и многие другие интерфейсы и события.

lazy module1: -> модуль маршрутизации -> 

const routes: Routes = [ { path: '**', component: NoaccessComponent } ]

Я подписал компонент, один раз войдя в систему, вызывая API, чтобы получить пути к динамическим маршрутам и добавляя их в лениво загруженные модули, как это 

addDynamicPath(config: Array<Route>, modulePath):
 Promise<Array<Route>> {

     return new Promise((resolve, reject) => {
       // Trigger change detection so _loadedConfig is available in router
       setTimeout(() => {
         var glb = this.global;
         var glb1 = this.router.config;
         var currentModule, currentModuleRoute;
         var currentrouteMap;
         let configIsChanged = false;
         if (modulePath != 'modulename') {
           for (const key in this.global.menuList) {
             if (key.toUpperCase() == modulePath.toUpperCase()) {
               currentModule = this.global.menuList[key];
             }
           }
           currentrouteMap = routeMap[modulePath];
           currentModuleRoute = config.filter(root => (root as any)._loadedConfig && root.path === modulePath);
           currentModuleRoute = currentModuleRoute.length > 0 ? currentModuleRoute[0] : null;

           if ((currentModule && currentModule.length > 0) && currentModuleRoute) {
             currentModule.forEach(element => {
               if (modulePath == 'crm' && ['users', 'roles'].indexOf(element.pagePath) != -1) {
                 let rPath = currentrouteMap.filter(r => r.path == element.pagePath)[0];
                 config.splice(2, 0, {
                   path: rPath.path,
                   component: rPath.component,
                   canActivate: [NavigationGuard],
                   data: { title: element.name }
                 });
               }
               else {
                 let path = element.pagePath.replace(modulePath + '/', '');
                 let rPath = currentrouteMap.filter(r => r.path == path)[0];
                 var temp=[]
                 if (rPath) {
                   currentModuleRoute._loadedConfig.routes.unshift({
                     path: path,
                     component: rPath.component,
                     canActivate: [NavigationGuard],
                     data: { title: element.name }
                   })
                 }
               }


             });
             currentModuleRoute._loadedConfig.routes.push({ path: '**', component: NoaccessComponent })
           }
           else {
             currentModuleRoute && currentModuleRoute._loadedConfig.routes.push(
               { path: '**', component: NoaccessComponent }
             )
           }
           console.log(currentModuleRoute._loadedConfig.routes);

         }

         resolve(null);
       }, 0);
     });   }

ленивый модуль routing.ts const маршруты: 

Routes = [ { path: '**',
 component: NoaccessComponent } ]

данные API 

[ { path: 'dynamic path1', component: dynamicmponent1name},
 { path: 'dynamic path1', component: dynamicmponent2name}, { path:
 'dynamic path1', component: dynamicmponent3name} ]

результат 

const routes: Routes = [ { path: 'dynamic path1', component:
 dynamicmponent1name}, { path: 'dynamic path1', component:
 dynamicmponent2name}, { path: 'dynamic path1', component:
 dynamicmponent3name} { path: '**', component: NoaccessComponent } ]

это происходит дажепри подписании и обновлении с любой страницы, например, Пример: localhost: 4200 localhost: 4200 / module / dynamicpath

...