angular6路由

1. vscode编辑器快速新建主路由:

ng-router
 
注意修改为 根路由为:‘forRoot()’
 
 1 import { Routes, RouterModule } from '@angular/router';
 2 import { NgModule } from '@angular/core';
 3 import { AppComponent } from './app.component';
 4 
 5 const routes: Routes = [
 6     { path: '', component: AppComponent }
 7 
 8     //{ path: 'path/:routeParam', component: MyComponent },
 9     //{ path: 'staticPath', component: ... },
10     //{ path: '**', component: ... },
11     //{ path: 'oldPath', redirectTo: '/staticPath' },
12     //{ path: ..., component: ..., data: { message: 'Custom' }
13 ];
14 
15 @NgModule({
16     imports: [RouterModule.forRoot(routes)],
17     exports: [RouterModule]
18 })
19 export class AppRoutingModule {}

2. 快速新建子路由:

ng-router-featuremodule
 1 import { NgModule } from '@angular/core';
 2 import { RouterModule, Routes } from '@angular/router';
 3 import { CommonModule } from '@angular/common';
 4 import { LoginComponent } from './login/login.component';
 5 
 6 const routes: Routes = [
 7     { path: 'path', component: LoginComponent }
 8 ];
 9 
10 @NgModule({
11     imports: [CommonModule, RouterModule.forChild(routes)],
12     exports: [RouterModule]
13 })
14 export class LoginRoutingModule {}

猜你喜欢

转载自www.cnblogs.com/hibiscus-ben/p/10167585.html