Что такое состояние ElementRef, когда он доступен в конструктор компонентов

Question

я могу получить доступ к ElementRef в конструкторе компонентов:

export class MyComponent { 
    constructor(element: ElementRef) { 
     element.nativeElement 

Что такое состояние этого DOM элемента:

1) с точки зрения DOM - он уже вставлен в DOM? Это сделано? Являются ли это дочерними компонентами элементов DOM, созданных и добавленных?

2) с точки зрения жизненного цикла дочерних компонентов - на каких этапах прошли дочерние компоненты - onInit, afterContentInit и т. Д.?

Answer 1

Внутренне каждый угловой компонент представлен как элемент и директива. Вы можете прочитать об этом в Here is why you will not find components inside Angular.

elementRef, который вы можете вводить в конструктор, фактически является элементом, используемым для размещения компонента. Теперь на ваши вопросы.

1) с точки зрения DOM - он уже вставлен в DOM? Это сделано? Есть Это дочерние компоненты DOM-элементы, созданные и добавленные?

Да, он создан и добавлен к родительскому элементу DOM. Он еще не отображается как процесс загрузки компонентов синхронно, поэтому браузер не имеет возможности перерисовать. Нет, его дочерние компоненты еще не созданы.

2) с точки зрения жизненного цикла дочерних компонентов - какие этапы имеют дочерние компоненты прошли - OnInit, afterContentInit и т.д.?

Все крючки жизненного цикла являются частью обнаружения изменений. Читайте больше в Everything you need to know about change detection in Angular. И дерево компонентов создается до обнаружения изменений. Таким образом, для этого компонента не были задействованы крючки жизненного цикла, и, как я уже сказал, ни один из детей еще не создан.

Answer 2

1) ElementRef.nativeElement доступен, когда вызывается ngAfterViewInit().

2) Если вы имеете в виду детей, переведенных на детей, то это ngAfterContentInit().