95

如果我希望函数 x 每次加载组件时都发生，无论是第一次，我导航到不同的站点并导航回来，还是组件第五次加载。

我应该把函数 x 放在什么里面？组件构造函数还是 OnInit？

4

3 回答 3

117

构造函数是 typescript 类的预定义默认方法。Angular 和constructor. 通常我们constructor用来定义/初始化一些变量，但是当我们有与 Angular 绑定相关的任务时，我们会转到 Angular 的ngOnInit生命周期钩子。ngOnInit在构造函数调用之后调用。我们也可以在构造函数中做同样的工作，但最好用它ngOnInit来启动 Angular 的绑定。

为了使用ngOnInit我们必须从核心库中导入这个钩子：

import {Component, OnInit} from '@angular/core'

然后我们用导出的类实现这个接口（这不是实现这个接口的强制要求，但通常我们这样做了）。

使用两者的示例：

export class App implements OnInit{
  constructor(){
     //called first time before the ngOnInit()
  }

  ngOnInit(){
     //called after the constructor and called  after the first ngOnChanges() 
  }
}

有关更多详细信息，另请参阅构造函数和 ngOnInit 之间的区别

于 2016-03-07T14:31:02.023 回答
31

第一个（构造函数）与类实例化有关，与Angular2无关。我的意思是构造函数可以用于任何类。您可以在其中对新创建的实例进行一些初始化处理。

第二个对应于 Angular2 组件的生命周期钩子：

  • ngOnChanges当输入或输出绑定值更改时调用
  • ngOnInit在第一个之后调用ngOnChanges

因此，ngOnInit如果您的函数的初始化处理依赖于组件的绑定（例如使用 定义的组件参数@Input），您应该使用，否则构造函数就足够了......

于 2016-03-07T13:56:44.550 回答
31

constructor()是一个打字稿功能，需要new SomeClass(). 构造函数确保类层次结构中正确的字段初始化顺序。

ngOnInit是一个 Angular2 生命周期方法，当 Angular 完成构建组件并在第一次评估绑定和更新输入之后调用它。

另请参阅构造函数和 ngOnInit 之间的区别

于 2016-03-07T13:57:20.857 回答