构造函数在类实例化时执行。它与棱角无关。这是Javascript的特性，Angular无法控制它

ngOnInit是Angular特有的，当Angular用所有输入属性初始化组件时，它会被调用

@Input属性在ngOnInit生命周期钩子下可用。这将帮助你做一些初始化的事情，比如从后端服务器获取数据等显示在视图中

@Input属性在构造函数中显示为未定义

为了测试这一点，我从NativeScript教程中借鉴编写了以下代码:

user.ts

export class User {
    email: string;
    password: string;
    lastLogin: Date;

    constructor(msg:string) {        
        this.email = "";
        this.password = "";
        this.lastLogin = new Date();
        console.log("*** User class constructor " + msg + " ***");
    }

    Login() {
    }
}

login.component.ts

import {Component} from "@angular/core";
import {User} from "./../../shared/user/user"

@Component({
  selector: "login-component",
  templateUrl: "pages/login/login.html",
  styleUrls: ["pages/login/login-common.css", "pages/login/login.css"]
})
export class LoginComponent {

  user: User = new User("property");  // ONE
  isLoggingIn:boolean;

  constructor() {    
    this.user = new User("constructor");   // TWO
    console.log("*** Login Component Constructor ***");
  }

  ngOnInit() {
    this.user = new User("ngOnInit");   // THREE
    this.user.Login();
    this.isLoggingIn = true;
    console.log("*** Login Component ngOnInit ***");
  }

  submit() {
    alert("You’re using: " + this.user.email + " " + this.user.lastLogin);
  }

  toggleDisplay() {
    this.isLoggingIn = !this.isLoggingIn;
  }

}

控制台输出

JS: *** User class constructor property ***  
JS: *** User class constructor constructor ***  
JS: *** Login Component Constructor ***  
JS: *** User class constructor ngOnInit ***  
JS: *** Login Component ngOnInit ***  

constructor()是Component生命周期中的默认方法，用于依赖注入。构造函数是一个Typescript特性。

ngOnInit()在构造函数之后被调用，ngOnInit在第一个ngOnChanges之后被调用。

例如:

建设者()-> ngOnChanges() -> ngOnInit()

如上所述，当输入或输出绑定值发生变化时调用ngOnChanges()。

该构造函数在Angular“实例化/构造”组件时被调用。 ngOnInit方法是一个钩子，它表示组件生命周期的初始化部分。 一个好的做法是只在服务注入时使用它:

constructor(private 
    service1: Service1,
    service2: Service2
){};

即使有可能，你也不应该在里面做一些“工作”。 如果你想在组件“初始化”时启动一些动作，请使用ngOnInit:

ngOnInit(){
    service1.someWork();
};

此外，涉及来自父组件的输入属性的操作不能在构造函数中完成。 它们应该放在ngOnInit方法或其他钩子中。 与视图(DOM)相关的元素也是一样的，例如viewchild元素:

@Input itemFromParent: string;
@ViewChild('childView') childView;

constructor(){
    console.log(itemFromParent); // KO
    // childView is undefined here
};

ngOnInit(){
    console.log(itemFromParent); // OK
    // childView is undefined here, you can manipulate here
};

第一个(构造函数)与类实例化有关，与Angular2无关。构造函数可以用在任何类上。您可以在其中放入一些新创建实例的初始化处理。

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

引用自angular官方网站:

当输入或输出绑定值发生变化时调用ngOnChanges 在第一个ngOnChanges之后调用ngOnInit

所以如果初始化处理依赖于组件的绑定(例如用@Input定义的组件参数)，你应该使用ngOnInit，否则构造函数就足够了…

这里需要注意两点:

每当该类创建对象时，都会调用构造函数。 一旦组件创建，就调用ngOnInit。

两者都有不同的可用性。