Angular路由

Angular路由

Angular路由功能是一个纯前端解决方案，需提前对指定的（ng-app），定义路由规则，然后通过不同的URL，告诉（ng-app）加载哪个页面，再渲染到视图中。Angular的前端路由可以实现单页面的局部刷新。

创建默认带路由的项目

在app-routing.module.ts配置路由

引入组件

import { NewsComponent } from './components/news/news.component';
import { HomeComponent } from './components/home/home.component';
import { NewscontentComponent } from './components/newscontent/newscontent.component';

配置路由

const routes: Routes = [
  {
    path:'home',component:HomeComponent
  },
  {
    path:'news',component:NewsComponent
  },
  {
    path:'newscontent',component:NewscontentComponent
  }
];