就Angular 2路由而言,我大多能够找到整个应用程序中只有一个路由文件的场景示例.
我想看一个不只使用一个路由文件,而是使用主路由文件,然后至少使用一个功能模块路由文件的示例.
编辑：我意识到a somewhat similar question已被问及答案.有两个原因我没有发现那个特别有用：
1)问题是针对该用户的情况非常具体,因此存在很多“噪音”.我要求的只是一个单独的功能模块路由示例.
2)该问题的答案似乎没有解决如何为功能模块创建路由文件,然后将其重新绑定到应用程序的主路由中.也许它就在那里,我只是错过了它,但我没有看到它.
让我们看看这个例子是否涵盖了您正在寻找的内容.
原文链接：https://www.f2er.com/angularjs/143935.html这些是使用的模块：
> AppModule(根模块)
> UsersModule(功能模块)
下面的片段是简化的.
app.module.ts
import { UsersModule } from './users.module';
import { AppRouting } from './app.routing';
@NgModule({
imports: [
BrowserModule,UsersModule,AppRouting,],declarations: [...],providers: [...],bootstrap: [ AppComponent ]
})
export class AppModule { }
app.routing.ts
const appRoutes: Routes = [
{ path: '',redirectTo: 'home',pathMatch: 'full' },{ path: 'home',component: Home },{ path: '**',component: NotFound },//always last
];
export const AppRouting = RouterModule.forRoot(appRoutes,{
useHash: true
});
users.module.ts
import { NgModule } from '@angular/core';
import { UsersRouting } from './users.routing';
@NgModule({
imports: [
CommonModule,// ngFor,ngIf directives
UsersRouting,providers: [...]
})
export class UsersModule { }
users.routing
const usersRoutes: Routes = [
{ path: 'users',children: [
{ path: '',component: Users },{ path: ':id',component: User }
]
}
];
export const UsersRouting = RouterModule.forChild(usersRoutes);
Plunker：
http://plnkr.co/edit/09Alm0o4fV3bqBPUIFkz?p=preview
示例代码还包括AboutModule(延迟加载模块,包括解析示例),但不包括共享模块示例.
您可以在以下幻灯片中找到更多详细信息
https://slides.com/gerardsans/ngpoland-amazing-ng2-router
