Angular 2路由 - 如何處理路由匹配衝突？

Question

我有兩條路線我想匹配，但它們相互衝突。我有一個通用的路線，其中path: ":page"，但我有另一個具體的路線path: "id_token"。理想情況下，路由器會首先檢查path: "id_token"是否匹配，然後再回到path: ":page"。

export const ROUTES: Route[] = [ 

    // If this route is a match then use this config 
    { 
     path: "id_token", 
     pathMatch: "prefix", 
     redirectTo: ":page/d", 
    }, 

    // Otherwise use this config 
    { 
     path: ":page", 
     component: "PageComponent", 
    } 
]; 

Answer 1

您可以使用CanActive這

@Injectable() 
class MyCanActivate implements CanActivate { 
    constructor() {} 
    canActivate(
     route: ActivatedRouteSnapshot, 
     state: RouterStateSnapshot 
    ): Observable<boolean>|Promise<boolean>|boolean { 
     return true/false; //to active/deactive your route 
    } 
} 

然後您路線：

export const ROUTES: Route[] = [ 

    // If this route is a match then use this config 
    { 
     path: "id_token", 
     pathMatch: "prefix", 
     redirectTo: ":page/d", 
     canActivate: [MyCanActivate] 
    }, 

    // Otherwise use this config 
    { 
     path: ":page", 
     component: "PageComponent", 
    } 
];