0

我有一个类似这样的 URL：

base_path/some_path?elementId=33203

基本上，用户可以并且通常通过在浏览器中粘贴上述链接来导航到该路径。我需要在组件之前加载该组件的数据，因此我开始阅读 Angular 路由教程，特别是旨在实现我所拥有的确切难题的解析器服务。所以我创建了一个解析器服务，例如：

resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<SomeObject> {
    let loanId = route.queryParams['elementId'];

    if (isNil(loanId)) {
      return null;
    }
    return this.service.getElementById(elementId)
      .subscribe(response => {
    //response is JSON
          return Observable.of(response);
        }
        else {
          return null;
        }
      });
  }

这个解析类现在添加到 app.routing.module.ts 中，例如：

{ path: 'base_path/some_path', component: SomeComponent,
resolve : {
  someObject: SomeObjectResolver
}

}

并在我的component.ts文件中进行相应的修改，如：

ngOnInit() {
     this.route.data.subscribe((data: { someObject: SomeObject}) => {

     });

}

我在解析器和组件文件中设置了调试断点。当我访问 URI:base_path/some_path?elementId=33203时，它首先访问了解析器，但是由于解析器调用了服务（这反过来又调用了对服务器获取数据的 ajax 调用），它然后简单地继续到组件，并调用 ngOnInit 函数，tryin在 (data: { someObject: SomeObject}) 上调用订阅函数

但是， someObject 尚不可用，因此它会引发错误并重定向。

我错过了什么？resolve 函数不应该在调用它之前显式加载它的组件的数据吗？

4

1 回答 1

0

你必须返回一个 Observable，你不需要订阅它然后返回一个新的 observable

resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<SomeObject> {
  let loanId = route.queryParams['elementId'];

  if (isNil(loanId)) {
    return Observable.of(null);
  }
  return this.service.getElementById(elementId);
}
于 2017-11-21T22:27:54.080 回答