angular学习笔记之ngOnInit方法和constructor的区别
最近在学习angular英雄demo时,发现中文文档上说了如图这一段话;虽然这里介绍了ngOnInit方法和constructor的区别,但是我觉得太过笼统。为什么构造器不能调用某个函数来向远端发送http请求(虽然在构造器中处理逻辑不规范),于是自己找了些资料整理了一下。
1、constructor
constructor是class的构造函数,当对象被实例化的时候被调用;这里经常处理初始化和给属性赋值的动作;如图:
2、ngOnInit
ngOnInit是实现了OnInit生命钩子,用来初始化组件;在官网的文档上的说明如下:
区别:
1)执行顺序,constructor和ngOnInit都能进行初始化,那它们的执行先后顺序是什么呢?看下图demo
我们发现constructor是在ngOnInit之前执行的,说明constructor是在组件实例化时就已经执行了;在官网文档中说ngOnInit是在第一次显示数据绑定和设置组件的输入属性之后,初始化组件的;那constructor是否能设置组件的输入属性呢?
2)输入属性
HerosComponent是父组件
HeroDetailComponent是子组件,pname为父组件的输入属性
运行结果:
说明在construct中取不到输入属性的值
所以官网文档中说 它肯定不能调用某个函数来向远端服务(比如真实的数据服务)发起 HTTP 请求。