I have a component who shows a list of item than can be filtered using url queryParams, thos items are paginated from the api, and if a filter is set, i need to call the first page again, this first call is in the resolver of the router, so what I need is that the router reload in the same way as if I came from other URL.
app.routes.ts
const appRoutes: Routes = [ { path: 'applications', component: AppComponent, resolve: { data: AppResolve } }, ] app.resolver.ts
@Injectable() export class AppResolve implements Resolve<any> { constructor() {} resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<any> { // call to the api and the first 50 applications filtered by the url queryParams } } app.component.ts
@Component({ // ... }) export class AppComponent { constructor(private route: ActivatedRoute, private appService: AppService) { this.route.data.subscribe((data: any) => { // recive the first 50 applications }) } loadMoreApps(): void { // call to the api for the next 50 applications filtered by the url queryParams } } app.service.ts
@Injectable() export class AppService { constructor(private router: Router, private route: ActivatedRoute) {} navigate(urlQueryParams: any): void { this.router.navigate(['/applications'], {queryParams: urlQueryParams}); } } other.component.ts
@Component({ // ... }) export class OtherComponent { constructor(private appService: AppService) {} filterApps(): void { const filters = { 'category': 'game', 'author': 'username' } this.appService.navigate(filters) } } 
