[解決済み] Angularでは、アクティブなルートをどのように決定するのですか？

質問

NOTE ここには様々な答えがあり、そのほとんどが一度や二度は有効だったものです。実際、AngularチームがRouterを変更するたびに、何が有効かは何度も変更されてきました。 最終的になるであろうRouter 3.0バージョンは は Angularのルーターはこれらの解決策の多くを壊しますが、独自の非常にシンプルな解決策を提供します。RC.3の時点では、好ましい解決策は [routerLinkActive] のように この答え .

Angularアプリケーション（これを書いている時点では2.0.0-beta.0リリース）において、現在アクティブなルートが何であるかはどのように判断するのでしょうか。

Bootstrap 4 を使用するアプリに取り組んでいますが、ナビゲーションリンクやボタンを、関連するコンポーネントが <router-output> タグを使用します。

ボタンがクリックされたときの状態を自分で管理することもできますが、同じルートに複数のパスがある場合（たとえば、メインナビゲーションメニューとメインコンポーネントのローカルメニュー）には対応できません。

何かご提案やリンクがあれば、よろしくお願いします。 ありがとうございます。

解決方法は？

新しい アンギュラールーター を追加することができます。 [routerLinkActive]="['your-class-name']" 属性をすべてのリンクに追加します。

<a [routerLink]="['/home']" [routerLinkActive]="['is-active']">Home</a>

また、クラスが1つだけ必要な場合は、配列ではない簡略化された形式を使用します。

<a [routerLink]="['/home']" [routerLinkActive]="'is-active'">Home</a>

また、クラスが1つだけ必要な場合は、さらにシンプルな形式になります。

<a [routerLink]="['/home']" routerLinkActive="is-active">Home</a>

をご覧ください。 ドキュメントが乏しい routerLinkActive ディレクティブ をご覧ください。(私はほとんど試行錯誤でこのことを理解しました)。

UPDATE: routerLinkActive ディレクティブは、現在、以下の場所にあります。 こちら . (下のコメントで@Victor Hugo Arango A.さんに感謝します)。