Angular2ビューの更新ライフサイクルフックはありますか？

Question

私は、親コンポーネントからデータを受け取り、divにテキストを表示する子コンポーネントを持っています。親はundefinedをデータとして送ることができます。それが実行されると、divはその高さを0に遷移させるはずです。これはCSSの遷移を介して行います。テキストの長さがわからないので、divの高さはautoに変わったはずです。私はこのようなコードサンプルを見つけました。私は自分のコンポーネントに適合するように変換しました。 ngOnChangeが呼び出されたときに

export class LanguageDetail implements OnChange, OnInit { 
    @Input() language: Language 
    @ViewChild("detailPanel") detailPanel: ElementRef; 

    private shownLanguage: Language; 

    ngOnInit() { 
     this.shownLanguage = new Language(); 
    } 

    ngOnChange() { 
     if (this.detailPanel) { 
      var detailPanel: JQuery = $(this.detailPanel.nativeElement); 

      if (this.language) { 
       ... 
       // calculate the end height and apply a transition with fixed values to this.shownLanguage 
       this.shownLanguage = this.language; 

       oldHeight = detailPanel.height(); 
       detailPanel.height("auto"); 
       newHeight = detailPanel.height(); 
       detailPanel.height(oldHeight); 
       ... 
      } else { 
       ... 
       // do a transition to 0 for this.shownLanguage 
       ... 
      } 
     } 
    } 
} 

今の問題は、プロパティの言語が実際に変更されたされ、ビューはしかし this.shownLanguageにバインドされ、 this.languageがngOnChange関数内でそれに割り当てられている場合、実際に更新されません。 this.languageへのバインディングにも同じことが起こります。 OnChangeイベントが早すぎます。 divにテキストが入力されていないため、正確な高さが表示されず、計算が正しく行われません。ビューが変更されたときにトリガされるイベントが実際に存在するのですか、ビューを再描画して実際にdivを正しい高さにすることができますか？

Answer 1

確かに、

[LifecycleHooks.OnInit, OnInit], 
    [LifecycleHooks.OnDestroy, OnDestroy], 
    [LifecycleHooks.DoCheck, DoCheck], 
    [LifecycleHooks.OnChanges, OnChanges], 
    [LifecycleHooks.AfterContentInit, AfterContentInit], 
    [LifecycleHooks.AfterContentChecked, AfterContentChecked], 
    [LifecycleHooks.AfterViewInit, AfterViewInit], 
    [LifecycleHooks.AfterViewChecked, AfterViewChecked], 

AfterViewChecked

AfterViewCheckedについて何 - あなたのコンポーネントのビューのすべてのチェック後に通知を得るために、このインターフェイスを実装します。