angular2:路由器的使用

Angular路由器是一个可选的外部Angular ngModule，通过配置和使用路由器，页面可以根据url来切换不同的视图以达到导航的目地。

首先，要在根module中导入RouterModule模块并配置routers。

import { RouterModule } from '@angular/router';

@ngModule({

imports: [

 RouterModule.forRoot([{

    path: 'page1',

   component: Page1Component

}])

]

})

当url地址以/page1结尾时，页面的视图就会显示Page1Component的模板，但是显示在哪里呢？

在根组件的模板中使用路由指令RouterOutlet标签，目标视图就会显示在这个标签内。

...

template: `

       

`

...

但是我们的链接呢？如果直接使用显然无法和路由关联起来，这个时候我们就要使用另外一个路由指令RouterLink。

...

template: `

        to page1

       

`

...