2

I have a route configuration which allows a user to view the recent activities that has been done based on a criteria like so :

{ path: 'workspace', component: WorkspaceComponent, children: [
{ path: 'upload', component: UploadComponent },
{ path: 'verify', component: VerifyComponent, resolve:{dataObject: RecentActivityResolver}}]}

The resolver returns a object from an arraylist stored in a service class. I am not directly accessing the service class in my VerifyComponent since I intend to change from arrays to HTTP requests soon.

@Injectable()
export class RecentActivityResolver implements Resolve<RecentActivityModel>{
constructor(private recentActivity: RecentActivityService){}
resolve(activatedRoute: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<RecentActivityModel> |
Promise<RecentActivityModel> | RecentActivityModel {
    console.log(activatedRoute.queryParams['id']); // gives me the correct result here
    return this.recentActivity.recentActivities[+activatedRoute.queryParams['id']];
    }
}

On my child component I fetch the details from the data observable like so :

ngOnInit(){
    this.activatedRoute.data.subscribe((data: Data) => {
        console.log(data['dataObject']); // undefined
        this.displayActivity = data['dataObject'];
    });
    this.activatedRoute.queryParams.subscribe((data: Data) =>{
        console.log(data['id']); // correct data here
    });
}

I am not able to understand why the data is not coming here. Can anyone guide me? Thanks in advance.

NTP
  • 4,338
  • 3
  • 16
  • 24
Ka0s
  • 21
  • 3
  • I havent seen this before ... resolve:{dataObject: RecentActivityResolver} ... try this instead ... resolve:RecentActivityResolver ... and make dataObject part of the JSON resolved response - worth using "RxJs of" to mimic an Observable response so its easy to swap out for HTTP later – danday74 Oct 08 '18 at 21:03
  • 1
    @danday74 The pattern he's using is the same as what is shown [in the official docs](https://angular.io/api/router/Resolve) – Gyan aka Gary Buyn Oct 08 '18 at 22:15
  • 1
    @danday74 I tried to add a simple string resolver and that works perfectly. I work around the problem with the solution as given but I do not understand this behavior. Thanks for helping though! – Ka0s Oct 09 '18 at 02:26

1 Answers1

0

Oddly enough the solution/work around was to move the resolver to the parent. But I really want to know why that is.

{ path: 'workspace', component: WorkspaceComponent, resolve:{dataObject: RecentActivityResolver}, children: [
{ path: 'upload', component: UploadComponent },
{ path: 'verify', component: VerifyComponent }
]}
Ka0s
  • 21
  • 3