Angular 2でrouter.navigateを使用して同じURLをリロードしようとしていますが、機能していません。url: http:// localhost:3000/landing シナリオ:私は http:// localhost:3000/landing にいて、ページをリロードする必要があるページの特定のパラメータを変更しています。
コード:
let link = ['Landing'];
this.router.navigate(link);
いくつかのダミーコンポーネントに移動し、リロードするコンポーネントに移動します。 // 2番目のパラメータ_skipLocationChange = trueで、戻るボタンのURLを回避
this.router.navigateByUrl('/DummyComponent', true);
this.router.navigate(["Landing"]);
this.router.navigateByUrl('/DummyComponent', {skipLocationChange: true}).then(()=>
this.router.navigate(["Landing"]));
コンストラクタで PlatformLocation:onPopState と NgZone:run を使用して、コンポーネントのリロードを実装することができました。これは回避策でしたが、少なくとも必要な方法で機能しました。
constructor(
private route: ActivatedRoute,
public router: Router,
private platformLocation: PlatformLocation,
private ngZone: NgZone) {
platformLocation.onPopState(() => {
if(platformLocation.pathname.startsWith("/currentRoute")) {
this.ngZone.run(() => {
console.log("Reloading component");
});
}
});
}
onPopState
が使用されたのは、ブラウザの戻る/進むボタンでリロードがトリガーされるはずだったためです。また、pathname
のチェックは、onPopState
メソッドがコンポーネントの注入時にすべてのルートのバック/フォワードで呼び出されていたため、使用する必要がありました。