Angular4ルータ：routerLinkActiveクラスは、私はこのようAngular4で定義されているアクティブなルートクラス、選択したい

Question

が、私は短い質問を持って追加されます。イベント：現在

$(".navigation > nav.side > ul > li.active ul.sublist").show(); 

を、私はonInit()でこのメソッドを呼び出しますAngularの方法ですが、これは機能しません。 onInit()メソッドが実行されたときに、routerLinkActiveクラスが追加されていないことがわかりました。今私の質問：ルータがこのクラスの追加を完了したときに発生するイベントはありますか？私はページリロードで一度だけ起動したイベントが必要です！

私は少しの周りの仕事を持っているが、これは本当に信頼できないではありません。

onInit(): void { 
    setTimeout(() => { 
     $(".navigation > nav.side > ul > li.active ul.sublist").show(); 
    }, 1); 
} 

Answer 1

それはあなたがあなたの角度アプリでjQueryのを使用しようとしているようです。角度のあるフォークは、「角度」のやり方をお勧めします。あなたには、いくつかのCSSを適用したい場合は、現在のrouterLinkはあなたがngIfまたは[隠さ]バインドを使用することができ、その特定の要素を表示しようとしている場合は、https://angular.io/docs/ts/latest/api/router/index/RouterLinkActive-directive.html

から

<a routerLink="/user/bob" routerLinkActive="active-link">Bob</a> 

ような何かを行うことができますactiveある場合あなたが隠したい要素に移動します。 ！

ビューは

<navigation> 
    <nav class="side"> 
    <ul> 
     <li class="active"> 
     <ul class="sublist" *ngIf="showSublist"> 
     <-- or 
     <ul class="sublist" [hidden]="!showSublist"> 

ngIfは、ディスプレイに評価：隠されたのに対し、どれも視認性が、これはHTML要素を選択している

showSubList() { 
    this.showSublist = true; 
}