Javascript ngOnChanges是否更新输入属性？

我对Angular不太熟悉，只是一个关于

ngOnChanges

的问题。我知道

ngochanges（）

方法接受一个参数（包含来自“@angular/core”的SimpleChange），我们可以检索最新的更改值，如下所示：

import { Directive, ElementRef, Input, SimpleChange } from "@angular/core";
...
@Input("pa-attr")
bgClass: string;


ngOnChanges(changes: { [property: string]: SimpleChange }) {
    let change = changes["bgClass"];
    console.log(change.currentValue);
}

---

但是，

ngochanges

实际上更新了输入属性吗？

bgClass

？或者它只是检索最新的更改值，就这样？

ngochanges是一个钩子，当decorator@input定义的值将被更新时调用。在ngochanges内部，您已经可以从中读取实际值。{YOUR\u input\u NAME}

官方文件-&

---

您不需要ngOnChanges来更新@Input定义的值，它们将由组件的父组件更新。ngOnChanges只允许您检测更改，并在需要时使用更新的数据执行一些逻辑。

ngOnChanges是一个钩子，当decorator@Input定义的值将被更新时调用。并且ngOnChanges的nside您已经可以从中读取实际值。{YOUR_INPUT_NAME}

官方文件-&

---

更新@Input定义的值不需要ngOnChanges，它们将由组件的父组件更新。ngOnChanges只允许您检测更改，并在需要时使用更新的数据执行某些逻辑。

ngOnChanges是Input（）的生命周期挂钩当引用更改时调用

在这里，保持简单数据类型的点是不可变的，因此每次更改值引用时都会更新，并且会调用ngOnchanges并进行比较

但对于对象和复杂数据类型Angular，它会进行浅层比较，不会检查深层的每个值，因此，尽管在父级中更改了输入值，它也不会调用子级的ngOnChanges

---

在更改检测期间，当Angular检查组件的输入属性以进行更改时，它使用（基本上）==进行脏检查。对于数组，这意味着数组引用（仅）是脏检查的。由于rawLapsData数组引用没有更改，因此不会调用ngOnChanges（）

我可以想出两种可能的解决办法：

实现ngDoCheck（）并执行您自己的更改检测逻辑，以确定数组内容是否已更改。（Lifecycle Hooks文档中有一个示例。）

每当您对数组内容进行任何更改时，将新数组分配给rawLapsData。然后将调用ngOnChanges（），因为数组（引用）将显示为更改

在你的回答中，你提出了另一个解决方案

在此重复关于OP的一些评论：

我仍然不知道圈数是如何适应变化的（当然它一定是使用了与ngOnChanges（）本身相当的东西），而map却不能

• 在laps组件中，代码/模板在lapsData数组中的每个条目上循环，并显示内容，因此在显示的每个数据段上都有角度绑定

• 即使Angular没有检测到组件输入属性的任何更改（使用===检查），它仍然（默认情况下）脏检查所有模板绑定。当这些更改发生时，Angular将更新DOM。这就是您看到的

• maps组件的模板中可能没有任何与lapsData输入属性的绑定，对吗？这就解释了区别。 请注意，组件中的lapsData和父组件中的rawLapsData都指向相同/一个数组。因此，即使Angular没有注意到lapsData输入属性的任何（引用）更改，组件“获取”“/查看任何数组内容的更改，因为它们都共享/引用该数组。我们不需要像对待基本类型（字符串、数字、布尔值）那样传播这些更改。但对于基元类型，对值的任何更改都会触发ngOnChanges（）——这是您在答案/解决方案中利用的

---

正如您现在可能已经了解到的，对象输入属性与数组输入属性具有相同的行为。

ngochanges是在引用更改时调用的input（）的生命周期挂钩

在这里，保持简单数据类型的点是不可变的，因此每次更改值引用时都会更新，并且会调用ngOnchanges并进行比较

但对于对象和复杂数据类型Angular，它会进行浅层比较，不会检查深层的每个值，因此，尽管在父级中更改了输入值，它也不会调用子级的ngOnChanges

---

在更改检测期间，当Angular检查组件的输入属性以进行更改时，它使用（基本上）==进行脏检查。对于数组，这意味着数组引用（仅）是脏检查的。由于rawLapsData数组引用没有更改，因此将不会调用ngOnChanges（）

我可以想出两种可能的解决办法：

实现ngDoCheck（）并执行您自己的更改检测逻辑，以确定数组内容是否已更改。（Lifecycle Hooks文档有一个示例。）

每当对数组内容进行任何更改时，将新数组分配给rawLapsData。然后将调用ngOnChanges（），因为数组（引用）将显示为更改

在你的回答中，你提出了另一个解决方案

在此重复关于OP的一些评论：

我仍然不知道圈数是如何适应变化的（当然它一定是使用了与ngOnChanges（）本身相当的东西），而map却不能

• 在laps组件中，代码/模板在lapsData数组中的每个条目上循环，并显示内容，因此在显示的每个数据段上都有角度绑定

• 即使Angular没有检测到组件输入属性的任何更改（使用===检查），它仍然（默认情况下）脏检查所有模板绑定。当其中任何一个发生变化时