Angular 2:将值传递给路径数据解析

Bee*_*ice 12 typescript angular

我正在尝试编写一个DataResolver服务,允许Angular 2路由器在初始化组件之前预加载数据.

解析器需要调用不同的API端点来获取适合于正在加载的路由的数据.我正在构建一个通用解析器,而不是为每个组件设置一个解析器.因此,我想在路由定义中传递指向正确端点的自定义输入.例如,考虑以下路线:

app.routes.ts

appRoutes = [
  {
     path: 'project/:id',
     component: ProjectComponent,
     resolve: { data: DataResolver }
  },
  {
     path: 'store/:id',
     component: StoreComponent,
     resolve: { data: DataResolver }
  }
]
Run Code Online (Sandbox Code Playgroud)

首先,解析器需要调用/path/to/resource1/id.在第二种情况下,/path/to/resource2/id.理想情况下,我会将端点作为路径定义中的参数传递,然后在DataResolver构造函数中可用.

这可以用通用的解析器类来完成吗?

Angular 2.0.1 写的 Typescript 2.0.3

Pau*_*tha 22

我不知道如何在构造函数中使用它,而不使用DI.但是如果你想在resolve方法中使用它,你可以data在路由定义中添加一个属性,这将使它可用于ActivatedRouteSnapshot

{
  path: 'project/:id',
  component: ProjectComponent,
  resolve: { data: DataResolver },
  data: { path: 'project/:id' }
}

class DataResolve implements Resolve<string> {
  resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
    return route.data['path'];
  }
}
Run Code Online (Sandbox Code Playgroud)

  • 我发现这篇文章很有帮助。https://alligator.io/angular/route-resolvers/#access-to-route-params (2认同)