Angular内置指令--路由指令

最新推荐文章于 2024-09-09 19:15:30 发布

weixin_34232744

最新推荐文章于 2024-09-09 19:15:30 发布

阅读量126

点赞数

文章标签： javascript python ViewUI

原文链接：https://my.oschina.net/u/3412211/blog/896277

版权

2019独角兽企业重金招聘Python工程师标准>>>

Angular2的内置指令可分为通用指令、路由指令、表单指令

路由指令有3个，包含在RouterModule中 :

RouterLink
RouterOutlet
RouterLinkActive

RouterLink : 使得应用可以链接到特定组件，可以被应用在任何HTML元素上。

    <a [routerLink]="['/user/jim']">Jim</a>

If the first segment begins with /, the router will look up the route from the root of the app.
If the first segment begins with ./, or doesn't begin with a slash, the router will instead look in the children of the current activated route.
And if the first segment begins with ../, the router will go up one level.

RouterOutlet : 路由跳转时，Angular会查找当前匹配的组件并将组件插入到RouterOutlet中。

    <router-outlet></router-outlet>

RouterLinkActive : 当路由激活时为当前该元素添加指定CSS类样式。

    <a [routerLink]="['/user/bob']" routerLinkActive="active-link">Bob</a>
    //多个CSS类时
    <a [routerLink]="['/user/bob']" [routerLinkActive]="['class1', 'class2']">Bob</a>

转载于:https://my.oschina.net/u/3412211/blog/896277