2016-11-17 37 views
2

我可以在组件构造访问ElementRef什么是ElementRef的状态时,它的成分构造可

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

这是什么DOM元素的状态:在以下方面

1) DOM - 它已经放入DOM了吗?它是否被渲染?它是否是子元素DOM元素的创建和追加?

2)在子组件生命周期方面 - 子组件经历了哪些阶段 - onInit,afterContentInit等?

回答

1

内部的每个Angular组件都被表示为一个元素和一个指令。你可以在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。组件树是在更改检测之前创建的。所以没有触发这个组件的生命周期钩子,正如我上面所说的,还没有孩子创建。

2

1)当调用ngAfterViewInit()时,ElementRef.nativeElement是可用的。

2)如果你的意思是包庇儿童,那么它是ngAfterContentInit()

+0

请问您可以添加更多细节吗?我正在寻找有关每个领域(DOM和角度周期)的具体问题的答案 –

+0

不确定你的意思。 'ElementRef'在注入时立即可用,'nativeElement' **是** DOM元素。当调用上述回调函数时,DOM元素是可用的,在此之前它只是'null'。这就是'nativeElement'。 –

+0

_ ElementRef在注入时立即可用,_ - 是的,但它可以处于内存中角度创建的状态,或已经附加到'document'树中,甚至在UI上呈现的状态。 –