Gibt es einen aktualisierten Lifecycle-Hook für Angular2?

Question

Ich habe eine Kindkomponente, die Daten von ihrem Elternteil erhält und Text in einem div anzeigt. Es ist möglich, dass das übergeordnete Element undefined als Daten sendet. Wenn es das tut, soll das div seine Höhe auf 0 übergehen, was ich über css-Übergang mache. Da ich die Länge des Textes nicht kenne, soll die Höhe des DIVs auf auto umgestellt werden. Ich habe ein Codebeispiel gefunden, das ich in meine Komponente umgewandelt habe.

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 
       ... 
      } 
     } 
    } 
} 

Jetzt ist das Problem, wenn ngOnChange tatsächlich geändert aufgerufen wird, hat die Eigenschaft der Sprache, aber die Aussicht auf this.shownLanguage gebunden und aktualisiert nicht eigentlich, wenn this.language, um es in der ngOnChange Funktion zugeordnet ist. Gleiches gilt für eine Bindung an this.language selbst. Das OnChange-Ereignis wird zu früh ausgelöst. Da der Text im Div fehlt, erhalte ich nicht die richtige Höhe und meine Berechnung läuft falsch ab. Gibt es tatsächlich ein Ereignis, das ausgelöst wird, wenn sich die Ansicht ändert, oder gibt es eine Möglichkeit, das Neuzeichnen der Ansicht zu erzwingen, sodass ich das div mit der richtigen Höhe erhalten kann?

Answer 1

Sicher, was AfterViewChecked

[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 - Implementieren Sie diese Schnittstelle nach jeder Prüfung Ihrer Komponente Sicht informiert werden.