Невозможно получить согласованный элемент Height внутри ngAfterViewInit - PullRequest
1 голос
/ 15 июня 2019

У меня есть ion-row внутри ion-grid, и элементы внутри ion-row отображаются динамически в соответствии с некоторыми условиями.

Моя цель - получить высоту ионного ряда, как только всеусловия вычисляются и отображается окончательный вид:

<ion-grid>
  <ion-row #elementContainer>
    <!-- Elements here are displayed dynamically -->
  </ion-row>
</ion-grid> 
import { Component, AfterViewInit, ViewChild, ElementRef } from '@angular/core';

@Component({
  //...
})
export class ConversationCardPage implements AfterViewInit {

    //...
    @ViewChild("elementContainer", { read: ElementRef }) elementContainer: ElementRef;

    ngAfterViewInit() {
        console.log(this.elementContainer && this.elementContainer.nativeElement
           ? this.elementContainer.nativeElement.clientHeight
           : -1)
    }

}

При регистрации этого кода я всегда получаю значение 0 как высоту elementContainer, но если я изменяю ngAfterViewInit до ngDoCheck или ngAfterContentChecked, я получаю правильную высоту элемента.

Как уже упоминалось в Angular Docs , ngDoCheck имеет стоимость, связанную с производительностью, иЯ хотел бы придерживаться ngAfterViewInit , поскольку он должен вызываться после инициализации представления:

В то время как ловушка ngDoCheck () может определять, когда имя героя изменилосьЭто ужасная цена.Этот хук вызывается с огромной частотой - после каждого цикла обнаружения изменений, независимо от того, где произошло изменение.В этом примере он вызывается более двадцати раз, прежде чем пользователь сможет что-либо сделать.

...