Angular 2+中OnInit钩子对应的组件初始化的确切含义与判定内容

Great question! 咱们结合Angular的生命周期逻辑来把这个问题拆解开说清楚：

首先先明确Angular官方对ngOnInit的定位：

ngOnInit会在Angular首次完成数据绑定属性的设置，且组件/指令的输入属性都已被赋值后触发，专门用于完成组件或指令的初始化工作。

那当我们说“组件已完成初始化”时，具体指向的是这两个层面的其中一部分，而非全部：

• 类层面的初始化已完成：这时候组件类里定义的所有属性（包括带@Input()装饰的父组件传入属性）都已经拿到了对应的值，你可以放心地在ngOnInit里编写依赖这些属性的逻辑——比如调用后端接口获取数据、基于输入值计算内部变量等。对比组件的constructor，这里完全不用担心输入属性还没就绪的问题。

• 模板视图尚未完成渲染：这是很容易混淆的点！ngOnInit触发时，Angular只是完成了模板的解析，但还没把组件的视图渲染到DOM中。如果你这时候尝试通过ViewChild获取子组件，或者直接操作DOM元素，很大概率会拿到undefined，因为这些元素还没被创建出来。要等到ngAfterViewInit钩子触发时，组件的视图和所有子组件才会完全渲染完毕，DOM元素也才能正常访问。

总结一下：当提到组件在ngOnInit阶段完成初始化时，指的是组件的类逻辑层面已准备就绪（输入属性、内部变量都已初始化），但模板视图还处于待渲染状态，两者并不兼具。

内容的提问来源于stack exchange，提问作者nakul bhatt