Question

刷新页面时，未定义通过路径数据属性传递的数据。我正在使用路由保护，并且基于模块的privilegeId，canActivate返回Observable boolean。

home.routing.ts

export const HomeRoutes: Routes = [
    {
        path: '',
        component: HomeComponent,
        canActivate: [AuthGuard],
        children: [
            { path: '', component: DashboardComponent },
            {
                path: 'groups',
                loadChildren: 'app/modules/groups/groups.module#GroupsModule',
                data: { privilegeId: 5 }
            }
        ]
    },
];
export const HomeRouting = RouterModule.forChild(HomeRoutes);

AUTH-guard.service.ts

canActivate(routeSnapshot: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | boolean {
// Issue: privilegeId is undefined on page reload.
let privilegeId = routeSnapshot.data["privilegeId"] as number;

// Calls API with privilege id and returns boolean.
}

Answer 1

刷新后，您将无法以某种方式访问父母防护中的路线数据。

首先，使用canActivateChild而不是canActivate来保护孩子的路线。

现在只有在刷新后才奇怪，ActivatedRouteSnapshot不在当前路由的范围内，这意味着当前路由没有路由数据。

幸运的是，完整的路由包含在RouterStateSnapshot属性（这是一棵树）的root中。

您现在可以沿着这棵树走下去（每个树只包含一个孩子），看看其中一个孩子是否有任何数据：

searchData(state: RouterStateSnapshot, dataKey: string): string | null {
    if (state.root.data && state.root.data[dataKey])
        return state.root.data[dataKey];
    let child: ActivatedRouteSnapshot | null;
    child = state.root.firstChild;
    while (child != null) {
        if (child.data && child.data[dataKey]) {
            return child.data[dataKey];
        }
        child = child.firstChild;
    }
    return null;
}

此方法在RouterStateSnapshot中搜索具有指定键的数据，并返回第一次出现的情况（如果有的话）或为空

Angular 2：页面刷新时未定义路径数据

1 个答案: