问题标签 [ngonchanges]

每当我使用 ngOnChanges() 方法更新组件 @Input 属性时，我都会尝试刷新角度组件，但它不起作用。

场景如下：

我有一个名为 all-tasks.component 的组件，其模板定义如下：

app-pie-chart组件是一个饼图组件，而app-tasks是一个托管 HTML 表格的组件，其中一些数据来自服务。

现在，如果用户在饼图的任何标签上进行选择，我希望右侧的表格用仅包含饼图中所选标签值的行进行刷新。

为此，我已经能够成功地从app-pie-chart组件发出 @Output 事件并在all-tasks组件上接收它。

但是，我无法将发出的值设置为所有任务组件的 @Input 元素以刷新表。我使用了 ngOnChange() 并尝试放置一个简单的 console.log 语句，但即使这样也不会打印。

从应用程序饼图中发出事件的代码

接收输出事件并将其设置为 app-tasks 组件中的@Input 属性的代码

all-tasks.component.ts 文件中的代码

}

在上面的代码中，我们已经通过 all-tasks.component.ts 文件将输出事件中检索到的值设置为在app-tasks组件的 Input 参数中发送

app-tasks 组件中 Input 参数的定义及其 ngOnChange 定义如下：

}

我已确保通过 console.log 语句正确发出和接收输出事件。但是，我发现问题是在 @Input 参数的设置中。

谁能指导我？

是不是因为我们试图在 app-tasks 组件中设置 Input 属性，该组件是一个简单的 javascript 对象，具有来自 all-tasks.component.ts 文件的 Array 类型对象？

我想在 ngx-chart-gauge 中可视化一些实时数据。
我用这个演示建立了这个： https
: //swimlane.gitbooks.io/ngx-charts/content/v/6.0.2/charts/gauge.html 我从服务中获取我的实时数据并希望在ngx 图表仪表。我从 Service ClassdataproviderService获取数据，它将对象保存在数组“单个”中。
这是我的ngx-chart-gauge 组件：

这是ngx-chart-gauge.html

这是我的服务，我从中获取数据：

当我尝试使用OnInit在仪表中注入数据时，仪表没有更新。为了解决这个问题，我尝试了 OnChanges，但现在我得到ERROR TypeError: Cannot read property 'big' of undefined...
我不知道是否可以在没有 OnChanges 的情况下自动更新仪表或如何避免使用 OnChanges 生命周期的 ERR钩？

我正在使用从父组件传递给子组件的对象数组。当新项目被推送到数组或数组中现有对象之一的属性发生更改时，它不会触发ngOnChanges使用此变量的组件（父/子/兄弟组件）。

在 AngularJS$watchCollection中，我们可以使用它来监视复杂的对象。Angular2+ 有类似的东西吗？

如何进行类似于$watchCollectionAngular2 + 的深度检查？

我熟悉 AngularJS，但不熟悉 Angular2 +。

更新：
按照@Shirish Patel 的建议here，我发现虽然变量的变化在各处得到反映，但该ngOnChanges函数没有被触发。为什么会这样？我需要触发此功能，以便我可以处理更改值的其他操作。

收到错误

f.ngOnChanges 不是函数

仅当我的 tsconfig.json 文件设置为以 es5 为目标时才会出现此问题，但是如果我的目标是 es6，则一切都按预期工作。

如果我的目标是 es5，有谁知道如何让 ngOnChange 工作？

tsconfig.json

我正在使用 ngOnChanges 来检测“idCopiadora”属性的当前值和先前值。当我要求 de currectValue 总是返回 de 当前值时，没关系，但以前的值总是返回 undefined 我看不出有什么问题，请帮忙。

组件父 .html:

组件父亲.ts：

子组件：

我的 Angular 应用程序中有一个带有 $onChanges 函数的组件“MealItemCollection”。该组件由两个单独的父组件“Recipe”和“MealPlan”使用。两个父组件都以完全相同的方式传入“items”道具。

但是，虽然 $onChanges 函数在从 MealPlan 组件传递对项目的更改时正常工作，但它仅在从食谱组件传递对项目的更改时工作 1 次。也就是说，当我有 0 个项目并添加 1 时，$onChanges 触发，但是当我有 1 个项目并添加到它时，$onChanges 不会触发。

在配方父组件中，我有一个带有 items 属性的“recipeModel”对象。当我添加一个项目时，它实际上确实向 recipeModel.items 添加了一个项目，正如 console.logs 所验证的那样。但无论出于何种原因，对 items 道具的更改都没有传递给 MealItemCollection 组件。

我尝试用 $doCheck 替换 $onChanges 但这不起作用，因为就像我说的那样，对 items 道具的更改没有传递到 MealItemCollection 组件中。

有人知道这里可能发生什么吗？

使用Angular 4。我有一个从它的父组件paging.component获取页码和pageSize （在它获取数据之后）。

将使用生命周期钩子paging.component查找对 ' 的更改。@InputOnChanges

paging.component也有一个<select>输入，您可以在其中更改pageSize。

在此OnInit阶段，<select>将设置为从父组件传入的pageSize 。

如果你改变pageSize，<select>一切正常，但我有时也想将pageSize从父组件更改为不同的值（如原始值）。

当我改变pageSize时，它​​不会更改<select>输入。（即使其他一切似乎都正常工作）。

我尝试将以下代码添加到ngOnChanges方法中：

但是，这会产生错误：

ExpressionChangedAfterItHasBeenCheckedError：表达式在检查后已更改。以前的值：“假”。当前值：“真”。

如果我尝试转到其他页面，分页似乎也会不断将自身重置到第 1 页。

我研究了一些其他的生命周期钩子ChangeDetectorRef，和ngZone，但这些似乎使问题变得更糟。

我在这里创建了一个plnkr 来演示错误。

如果您去paging.component.ts并用 注释掉该行，this.pageSizeCtrl.setValue(this.pagesize);那么一切正常，除了<select>不更新。

我试图实现 ngOnChanges() 来捕获以前的和当前的值。我实现的功能运行良好。我可以在控制台中看到以前和当前的值，但即使我的代码编译成功，我也会收到此错误。对于“propertyName”、“change”、“current”和“previous”，我遇到了同样的错误。如果我使用“const”而不是“let”，那么我的函数将不起作用。请帮忙！！

代码：

我是 Angular2 的新手，我一直在努力解决这个问题，但在网上找不到解决方案。

[在离子2上！]

我想使用 ngOnChanges() 所以我可以检测到zonaid的变化：

estados.html：

idespecie和itemsZon是 .json 文件的一部分

estados.ts

app.module.ts

一切都发生在同一个组件（离子页面）中。

我的目标是能够在zonaid更改时运行一个方法。如果您认为有比通过 ngOnChanges 更好的方法，请告诉我

谢谢！

我在同一个父母中有两个组件。当我单击onSubmit()组件 1 中的按钮时，它将向将事件submittedPayment存储到其中的父母发出一个事件，processingPayment然后组件 2 将通过父母接收此事件。但是，组件 2 具有 ngOnChanges 的功能，它与接收到的事件发射相冲突。当我单击onSubmit()控制台时，在函数中显示错误“无法读取未定义的属性 'currentValue'” ngOnChanges。如果我删除这个事件发射指令[disabledCancelBtn]="processingPayment"，代码可以正常工作，但组件 2 没有收到来自该点击操作的事件。

这是我的代码：

组件 1：

组件 2：

父母组件：

家长观点：