How to pass queryParams to an API endpoint using Angular 7 Resolver

Question

I need to pass queryParams (not route parameter) to an API endpoint using Resolver. How do you pass query parameter in component class and retrieve same in resolver? Please see my code snippets:

test.component.ts

loadTests(limit: number) {
this.route.data
   .subscribe(
     (data) => {
      this.tests  = data.tests;
     }
   );
}

test.resolver.ts

enter code here
  public resolve(
     route: ActivatedRouteSnapshot,
     state: RouterStateSnapshot
     ): Observable<ILaunch[]> {
    return this.testService.getAllTests(limit); // how do I retrieve 
        limit here from test component
       }

test.service.ts

public getAllTests( limit: number, ): Observable<ITest[]> {
return this.httpClient
  .get<ITestAPIData[]>(
    `${environment.baseUrl}tests?limit=${limit}}`
  )
  .pipe(map(data => (data)))
  .pipe(
    catchError())
  );
}

I have tried things like queryParams, params and switchMap but couldn't figure out how this should be implemented. Note: I don't want the query parameter to be passed to client routing url but API endpoint.

Any tip would be appreciated.

Thanks in advance

you can use `HttpParams`, can get help here - https://stackoverflow.com/questions/45210406/angular-4-3-httpclient-set-params — ashish pal, Mar 06 '19 at 09:36
@Bear. Thanks for the tips. But how do I pass limit value to 'this.route.data' . I need to get the same value to pass to the test.resolver.ts method? — coa, Mar 06 '19 at 12:56

How to pass queryParams to an API endpoint using Angular 7 Resolver

0 Answers0