Angular (2+): как узнать из родительского компонента, когда все дочерние компоненты были инициализированы?

Question

Есть ли хук жизненного цикла, так называемый "ngAfterAllChildrenInit", потому что ngAfterViewInit вызывается перед ngOninit дочерних элементов,

Я пытаюсь избежать взлома с помощью setTimeOut или отправки событий от всех детей и сбора их, а затем делаю то, что я хочу (это зависит от инициализации детей)

это кажется настолько распространенным, почему это не является частью угловых?

Answer 1

Вы можете использовать декораторы для этого. Я имею в виду угловые декораторы, а не нестандартные.

В твоих родителях:

activated: any = {};

У ваших детей:

constructor(@Host() parent: ParentComponent) {}

// Hook of your choice
ngOnInit() { this.parent.activated[this.constructor.name] = true; }

Это создаст activated объект как этот

activated = {
  FirstChildComponent: true
  // Second not initialized ? Then not here and activated[SecondChildComponent] = undefined
};

Answer 2

Ловушки Angular Lifecycle очень мощные, чтобы достичь желаемого, вы можете просто использовать ловушку OnInit. Angular читает ваш файл шаблона и запускает ваш компонент вертикально (сверху вниз). Итак, вам просто нужно делать все, что вы хотите, в методе ngOnInit вашего последнего компонента.

Если ваши компоненты используются в разных частях вашего приложения, вы можете проверить, что родительский компонент - тот, который вам нужен, с помощью декоратора @Host (см. Ответ @trichetriche).

Я создал блиц стека, где в компоненте приложения (родительском) используются 3 компонента в следующем порядке:

<hello name="{{ name }}"></hello>
<app-child></app-child>

Таким образом, сначала запускается ловушка AppComponent OnInit, а затем HelloComponent OnInit и, наконец, ChildComponent.

Смотрите его в действии на консоли: https://stackblitz.com/edit/angular-62xjux

РЕДАКТИРОВАТЬ: Вы можете использовать ngAfterViewChecked В документации указано:

Отвечать после Angular проверяет представления компонента и дочерние представления / представление, в котором находится директива.

Вызывается после ngAfterViewInit и каждого последующего ngAfterContentChecked().

Answer 3

как насчет того, чтобы воспользоваться услугой. последний ребенок публикует событие через observable, а родитель подписывается на него.