了解 Angular 组件的生命周期

问题描述

我很困惑。根据这个组件的生命周期，在调用 setNumbers 方法之前，我的数字数组应该是空的，但事实并非如此。我不知道在控制台打印之前 setNumbers 是如何执行的。对这个新手有什么解释吗？

export class AppComponent implements OnInit {
  numbers: number[] = [];

  ngOnInit() {
    console.log("first",this.numbers);
    this.setNumbers();
  }

  setNumbers() {
    this.numbers.push(1);
  }
}

Code SandBox

解决方法

如果您正在显示对象，则不能相信控制台中写入的内容。了解代码中发生了什么的最佳解决方案是通过断点。

现在，如果您确实需要在控制台中显示某些内容，您可以将值字符串化以便正确打印：JSON.stringify(this.numbers) 将在设置数字之前显示 []。