Angular2将数据从CanActivate保护传递到Resolve解析器?

时间:2017-05-18 16:48:46

标签: angular angular2-routing

我有一种情况,我在使用Resolve在导航到组件之前通过HTTP调用从远程源预加载一些数据。现在我需要实现一些保护逻辑,这需要根据某些条件预先加载数据以验证当前用户的某些字段。

我希望避免向CanActivate后卫中的后端发出完全相同的请求,然后立即在Resolve中发出相同的请求。

我是否可以通过某种方式从CanActivate或路径配置中访问路径数据以暂时覆盖解析器,并在数据对象上设置值,因为我已经得到了我的&#39 ; m即将要求?

我试图摆脱像

这样简单的事情
route.data['myData'] = value;

但这是一个错误,因为"对象不可扩展"。

我也尝试过这样的事情:

this.router.routerState.root.data['myData'] = value;

没有创建任何错误,但数据未能存活到route.data方法的Resolve.resolve()元素中。

我想避免像定制或黑客那样暂时将对象暂时存储在服务上,就像某种缓存一样。是否有任何标准机制在内部路由器元素之间传输数据以支持高级预取和数据所有权检查等内容?

修改 如果将路由器注入Resolve类的构造函数,并且以相同的方式访问它,则routerState可以正常工作。但这需要在之后清除,否则它会在导航呼叫之间保持不变。

1 个答案:

答案 0 :(得分:0)

data的属性ActivatedRouteSnapshot是不可变的,这就是您收到错误的原因:

  

对象不可扩展

但你可以替换整个对象,如:

@Injectable()
export class MyGuard implements CanActivate {
  canActivate(
    next: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {

    // Use the spread operator to keep the previously resolved data
    next.data = {...next.data, guardedData: 'guarded'};
    return true;
  }
}

并在您的解析器中访问它

@Injectable()
export class FooResolver implements Resolve<any> {

  resolve(
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot
  ): Observable<any>|Promise<any>|any {
    return route.data.guardedData;
  }

}