1. ホーム
  2. angular

[解決済み] Angular 2 パラメータ変更時にルートを再読み込みする

2023-07-17 15:08:01

質問

現在、初めてのAngular 2アプリケーションを書いています。 私は次のような単純なテンプレートを持つOverviewComponentを持っています。

<div class="row">
  <div class="col-lg-8">
    <router-outlet></router-outlet>
  </div>
  <div class="col-lg-4">
    <app-list></app-list>
  </div>
</div>

URLにアクセスする際に / にリダイレクトされます。 /overview にリダイレクトされ、ルータアウトレットの中でマップがロードされます。その <app-list> にはクリック可能なアイテムのリストがあり、これをクリックすると <app-detail> が表示されます。そこで、URLの中に参照するjsonファイルのidを以下のように渡しています。 /details/:id (というようにurlに参照元のjsonファイルのidを渡します(私のルートでは)。

上記はすべて全く問題なく動作します。リスト項目の1つをクリックすると詳細が表示されますが、別のリスト要素を選択すると、表示は新しい詳細に変わりません。URLは変更されますが、コンテンツは再読み込みされません。どうすればDetailComponentの再初期化を実現できますか?

どのように解決するのですか?

最初の最終リリースでは、この問題は解決されています。

ただ、パラメータが変更されたときにコンポーネントの状態を正しくリセットすることに十分注意してください。

this.route.params.subscribe(params => {
    this.param = params['yourParam'];
    this.initialiseState(); // reset and set based on new parameter this time
});