Angular Routes介绍

[deepthan]

什么是 Routes ?

它是一组路由的配置信息，均包含以下配置：

export declare type Routes = Route[];

export interface Route {
    path?: string;
    pathMatch?: string;
    matcher?: UrlMatcher;
    component?: Type<any>;
    redirectTo?: string;
    outlet?: string;
    canActivate?: any[];
    canActivateChild?: any[];
    canDeactivate?: any[];
    canLoad?: any[];
    data?: Data;
    resolve?: ResolveData;
    children?: Routes;
    loadChildren?: LoadChildren;
    runGuardsAndResolvers?: RunGuardsAndResolvers;
}

• path： 路径

path: 'signin'

它是一个用Angular路由器去匹配url对应关键词的字符串。
如path为 signin 那么对应的 url 是.../signin。

• pathMatch： 路径匹配规则

pathMatch : 'prefix' // 默认的
pathMatch : 'full' 

prefix（前缀）是默认的,会去匹配url是否含有path字段，如果有则进行重定向。
full（完整的），加上他会看path和路径是否完全一致，一致的话则重定向。

• matcher： 定义路径匹配的自定义策略，并取代路径和路径匹配规则

• component： 需要渲染的组件

• redirectTo： 重定向到的路由地址

• outlet： 一个路由对应多个组件

// 路由
{ path: 'news', outlet: 'outlet1', component: demo1Component },
{ path: 'news', outlet: 'outlet2', component: demo2Component },
//组件里面
<router-outlet name="outlet1"></router-outlet>
<router-outlet name="outlet2"></router-outlet>

• canActivate： 控制是否允许进入路由