如何使用单向绑定更改传递给子组件的对象

【问题标题】：How to change object which is passed down to child component with one-way-binding如何使用单向绑定更改传递给子组件的对象
【发布时间】：2020-02-02 20:23:30
【问题描述】：

我正在使用 AngularJS 1.6 和基于组件的 Web 应用程序。我正在构建一个包含表格的新组件，并在选择一行时显示另一个无状态组件，其中包含有关该行对象的详细信息（该行通过'

ctrl.$onChange = function(changes) {
    if (changes.row) {
        this.row = angular.copy(this.row);
    }
};

在子组件中的更改不再更改父组件中的对象的意义上它确实有效，导致通过引用绑定被破坏。

问题是：如果我在表中选择另一行，则更改的对象不再被传递，无状态组件不会“识别”绑定中更改的对象！如果我省略上面的代码它可以工作，但是在迁移到 Angular 时它仍然可以工作吗？我该怎么办？

【问题讨论】：

标签： angularjs components

【解决方案1】：

复制更改：

ctrl.$onChange = function(changes) {
    if (changes.row) {
        ̶t̶h̶i̶s̶.̶r̶o̶w̶ ̶=̶ ̶a̶n̶g̶u̶l̶a̶r̶.̶c̶o̶p̶y̶(̶t̶h̶i̶s̶.̶r̶o̶w̶)̶;̶
        this.row = angular.copy(changes.row.currentValue);
    }
};

来自文档：

生命周期钩子

指令控制器可以提供以下方法，由 AngularJS 在指令的生命周期中调用：

$onChanges(changesObj) - 每当单向 (<) 或插值 (@) 绑定更新时调用。 changesObj 是一个散列，其键是已更改的绑定属性的名称，值是{ currentValue, previousValue, isFirstChange() } 形式的对象。使用此钩子触发组件内的更新，例如克隆绑定值以防止外部值的意外突变。请注意，这也会在您的绑定初始化时调用。

有关详细信息，请参阅

AngularJS Comprehensive Directive API Reference - Life-Cycle Hooks

【讨论】：