url queryParamsが変更されたときの角4ルータのリロードビュー

Question

url queryParamsを使用してフィルタリングできるアイテムのリストを表示するコンポーネントがあります。アイテムはapiからページされ、フィルタが設定されている場合は、最初のページをもう一度、この最初の呼び出しは、ルータのリゾルバにあるので、私は他の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) 
    } 
} 

---

ルートで

Answer 1

はいつも "このようにプロパティを設定しrunGuardsAndResolvers：

const appRoutes: Routes = [ 
{ 
    path: 'applications', 
    component: AppComponent, 
    resolve: { 
     data: AppResolve 
    }, 
    runGuardsAndResolvers: 'always' // <----- This line 
} 

]

これは解決にあなたがルートにアクセスするたびに実行されます。

よろしくお願いいたします。