路由是什么（what）
在web开发中，路由是指将应用划分成多个分区，通常是按照从浏览器的URL衍生出来的规则进行分割。
为什么需要路由（why）
在应用中使用路由，可以
- 将应用程序划分为过个分区；
- 维护应用程序的状态；
- 基于某些规则保护应用分区。
也有可能你想的是，我们的应用程序是客户端，变换页面并不一定要更改URL。但是，若所有的页面使用同样的URL，会有什么后果呢？
- 刷新页面后，无法保留你当前的位置。
- 不能为页面添加书签，方便以后返回到相同的页面。
- 无法与他人分享当前页面的URL。
所以说，使用路由能让我们定义URL字符串，指定用户在应用中的位置。
简单的路由配置（How）
配置Angular路由时三种主要部件：
- Routes：描述了应用程序支持的路由配置
- RouterOutlet：这是一个占位符组件，用于告诉Angular要把这个路由的内容放在哪里。
- RouterLInk指令：用于创建各种路由链接。
路由配置方法
- 创建一个
Routes配置
const routes: Routes = [
{ path: '', redirectTo: 'home', pathMatch: 'full' },
{ path: 'home', component: HomeComponent },
{ path: 'about', component: AboutComponent },
{ path: 'contacts', component: ContactComponent },
{ path: 'contact', redirectTo: 'contacts' },
{ path: 'styling', component: StylingComponent},
{ path: 'popup', component: PopupComponent}
];
路由配置中的关键词的意义：
-
path：指定了该路由要处理的URL路径。 -
component：当前路由对应的组件。 -
redirectTo：用于将当前路由重定向到另一已知的路由上，是一个可选项。
- 安装路由配置
（1）导入RouterModule
（2）在NgModule中的imports数组里使用RouterModule.forRoot(routes)来安装路由配置。 - 使用<router-outlet>调用RouterOutlet指令
router-outlet元素标示了各个路由组件的内容应该在哪里被渲染。
