I have a situation where many of my resolvers (@angular/router Resolve) need to query the same data before executing their route-specific queries. To streamline this process, I want to create a resolver base class that resolves the initial data before the resolve() function in the derived class is triggered.
The base class:
export class MyBaseResolver implements Resolve<Observable<string>> {
myBaseProperty: string;
constructor(service: MyService) {}
resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): string {
this.service.getData()
.subscribe((data) => {
this.myBaseProperty = data;
});
}
}
The derived class:
export class MyDerivedResolver implements Resolve<Observable<Thing>> extends MyResolverParent {
constructor(public service: MyService) {
super(service);
}
// How can I modify this to ensure it waits for MyBaseResolver.resolve() to finish
// so "myBaseProperty" is ready to use?
resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<Thing> {
return this.service.getOtherData(myBaseProperty);
}
}
What is the best approach to make MyDerivedResolver wait for MyBaseResolver.resolve() to complete, ensuring that myBaseProperty is available and valid?