ngOnInit 在解析器数据准备好之前调用

Question

我下定决心从服务中调用 getSchools()

resolver.ts

export abstract class APIResolverService implements Resolve<any> {
          constructor(readonly dropdownService:DropDownOptionsService,readonly route:ActivatedRoute) { }
          abstract resolve();
        }


export class APISchoolsresolve extends APIResolverService{

      resolve(){
        this.route.queryParams.subscribe(params => {
          let district = params['district'];
          return this.dropdownService.getSchools(district);   
        })
      }

我的服务

async getSchools(districtID:number){
    return await this.http.get<ISchool[]>(`api/GetSchools/` + districtID).toPromise();
  }

我的组件

this.activatedRoute.data.subscribe((data) =>{

      console.log(data);
    })

我在组件中的数据未定义，因为它在我的解析器获取数据之前被调用。

我该如何解决这个问题？

Answer 1

你的 resolve 方法没有 return 任何东西。所以路由器不会等待任何事情被解决：它可能订阅或等待什么？

此外，resolve 方法采用 ActivatedRouteSnapshot。这就是您应该从中获取 districtID 的地方。

解析器应如下所示：

export class APISchoolsresolve implements Resolve<Array<ISchool>> {
  constructor(private dropdownService: DropdownService) { }

  resolve(route: ActivatedRouteSnapshot): Promise<Array<ISchool>> {
    return this.dropdownService.getSchools(+route.paramMap.get('district'));
  }
}

ngOnInit 在解析器数据准备好之前调用

ngOnInit is calling before resolver data is ready

typescript

angular6

angular-resolver

resolver.ts

我的服务

我的组件