[Angular2 Router] Index router

最新推荐文章于 2025-12-18 10:02:55 发布

转载最新推荐文章于 2025-12-18 10:02:55 发布 · 53 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/Answer1215/p/5946312.html

文章标签：

#javascript #ViewUI

本文详细介绍了Angular应用中的路由配置方式，包括默认路由设置、错误页面处理、路径重定向及懒加载模块的配置方法。

Index router as default router.

import {RouterModule} from "@angular/router";
import {NotFoundComponent} from "./shared-components/not-found/not-found.component";

const indexRoute = {path: '', redirectTo: 'home', pathMatch: 'full'};
const fallbackRoute = {path: '**', component: NotFoundComponent};
const routes = [
  {path: 'legacy-url', redirectTo: '/home', pathMatch: 'prefix'},
  {path: 'home', loadChildren: 'app/home/home.module', name: 'Home'},
  {path: 'heros', loadChildren: 'app/heros/heros.module', name: 'Heros'},
  {path: 'contact', loadChildren: 'app/contact/contact.module', name: 'Contact'},
  {path: 'message', loadChildren: 'app/message/message.module', name: 'Message'},
  {path: 'playground', loadChildren: 'app/playground/playground.module', name: 'Playground'},
  {path: 'realtime', loadChildren: 'app/realtime/realtime.module', name: 'Realtime'},
  {path: 'wiki-path', loadChildren: 'app/auxroute/auxroute.module', name: 'WikiDetail', outlet: 'wiki'},
  {path: 'courses', loadChildren: 'app/courses/courses.module', name: 'Courses'},
  indexRoute,
  fallbackRoute,
];

export default RouterModule.forRoot(routes, {useHash: true});