angular router

import { RouterModule,Routes,ActivatedRoute } from '@angular/router';

import { RouterModule,Routes,ActivatedRoute } from '@angular/router';

const routers:Routes = [
    {path:"",component:""},
    {path:"",component:"",children:{
            {path:"",component:""},
        }
    }
];

@NgModule({
    imports:[
        RoutesModule.forRoot(routers);
    ]
})

export class AppModule{
    // 获取参数
    constructor(param:ActivatedRoute){
         param.params.subscribe((params) => console.log(params));
    }
}

loadChildren

告诉�模块从另外模块中加载路由，格式：导出模块相对路径#导出模块名称

export const ROUTES: Routes = [
  {
    path: '',
    component: "",
    children: [
      { path: '', component: "" },
  
  }
];

@NgModule({
  imports: [
    CommonModule,
    RouterModule.forChild(ROUTES)
  ],
})
export class loadChildrenModule {}

export const ROUTES: Routes = [
  {
    path: 'loadChild',
    loadChildren: './loadChild/loadChild.module#loadChildrenModule'
  }
];

@NgModule({
  imports: [
    BrowserModule,
    RouterModule.forRoot(ROUTES)
  ],
  // ...
})
export class AppModule {}

router-outlet

存放路由显示容器

手动跳转路由

routerLink

<a routerLink="/"></a>
<a [routerLink]="['/',variable]"></a>

组件跳转路由

navigate()

export class AppComponent{
    constructor(private router: Router){
        setTimeout(()=>{
            this.router.navigate(['/',$event]);
        })
    }
}