如何在Angular中动态添加额外的路由
如何在Angular中动态添加额外的路由
提问于 2018-02-06 17:18:01
我正在使用Angular 5.2.2 (typescript)和Angular-CLI和.NET Core2.0。
我正在尝试向我的应用程序动态添加额外的路由。
我的想法是，我从一个服务器动态地获取我的路由，该服务器检查哪些模块应该对用户可用。但我似乎不能让路线变得可用。
我试着用RouterModule.forRoot添加它们，但没有成功。
我试过使用Router.resetConfig，但我似乎不能让它工作。我试图使用依赖注入在我创建的函数中获得它，但我最终得到了一个循环依赖：
Uncaught Error: Provider parse errors:
Cannot instantiate cyclic dependency! ApplicationRef ("[ERROR ->]"): in NgModule AppModule in ./AppModule@-1:-1下面是我的一小段代码：
app-routing.module.ts
import { NgModule, APP_INITIALIZER } from '@angular/core';
import { Routes, RouterModule, Router } from '@angular/router';
var routes: Routes = [{ path: '', loadChildren: "../app/modules/f2p-dashboard/f2p-dashboard.module#F2PDashboardModule" }];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule],
providers: [
{
provide: APP_INITIALIZER,
useFactory: AppConfigServiceFactory,
deps: [F2PModuleService, Router ],
multi: true
}
]
})
export function AppConfigServiceFactory(moduleService: F2PModuleService,
router:Router) {
return () => {
return moduleService.Init().subscribe((result) => {
let additionalRoutes = moduleService.GetRoutes()
routes = routes.concat(additionalRoutes);
console.log(routes);
//routes is filled
router.resetConfig(routes);
//RouterModule.forRoot(routes);
});编辑:我尝试添加的所有路由都使用loadChildren
回答 1
Stack Overflow用户
发布于 2018-08-15 22:39:20
其中一种方法是将路由推送到路由器中并使用resetConfig。
Example :
constructor(private router: Router, private route: ActivatedRoute) {}
const config = this.router.config;
config.push({
path: 'dynamicRoutePath',
component: DynamicRouteComponent,
});
this.router.resetConfig(config);
this.router.navigate(['dynamicRoutePath'], {relativeTo: this.route});这应该是可行的。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/48639377
复制相关文章
相似问题
腾讯云开发者
