在Angular2中禁用应用程序加载/路由

时间:2016-09-14 18:31:56

标签: angular configuration angular2-router

我有一个angular2应用程序(RC6版本),其中使用在启动时收集此文件的服务从配置文件加载一些重要的全局参数:

@NgModule({
imports:  [ BrowserModule, FormsModule, HttpModule, AppRoutes, SomeCustomModule ],
declarations: [ AppComponent ]
providers: [
            ConfigurationService,
            {
              provide: APP_INITIALIZER,
              useFactory: (config: ConfigurationService) => () => { 
                             return config.load().then(configParams=> { return true;});      
                          },
              deps: [ConfigurationService, HttpModule],
              multi: true
            }
          ],
bootstrap:[ AppComponent ]
})
export class AppModule { }

如本片段所示,我使用我所谓的 ConfigurationRervice ,它通过http调用读取配置文件并返回一些参数(作为Promise)。如果一切顺利,应用程序将完美加载,并且可以在整个子模块等中访问这些配置参数。

问题是,如果此配置文件未按预期加载,如何停止应用程序加载子模块? (请注意,AppComponent实质上只是一个路由器插座,重定向到其他路由,由多个子模块定义)。我可以“禁用”或重定向到错误页面,而不是加载由请求的路由定义的模块/组件吗?

1 个答案:

答案 0 :(得分:9)

要停用页面的初始路由,并根据您的ConfigurationService进行处理,您必须在false对象中将initialNavigation设置为AppRoutes

export const AppRoutes = RouterModule.forRoot(ROUTES, {initialNavigation : false});

ConfigurationService内,您必须注入router并根据您的配置使用此功能进行导航。

另一个选择是使用canActivate路由挂钩。在此钩子中,您可以注入ConfigurationService并让它确定是否可以加载此页面。

<强>更新

对于最新版本的角度,false的{​​{1}}值已被删除,请改为使用initialNavigation

'disabled'