无法从angular2的子组件中分配父组件中的数组

Question

对此可能有一个简单的解释，所以请原谅我的无知。

当使用子组件中的数组并在传递的值上使用.pop() .splice()和.push()时，它将持久保留父数组的值，但是当我尝试分配value（ = ）时不能将数组保留在父组件中。

我在Plunker上创建了一个简单的示例 。

该程序有3个按钮，清除，弹出和重新加载。

清除列表 -将@Input list分配给一个空数组（ this.list = [] ）。 请注意，父组件计数器不变

流行 -执行.pop()就行了。 请注意，父组件计数器会更改。

为什么不能简单地分配数组值呢？

我知道可以使用EventEmitter并让父级监听事件并以这种方式对其进行更新。 我试图了解这种情况，看看是否可以避免使用额外的代码。

Answer 1

父级和子级都引用同一/一个数组对象。 因此，如果您更改数组的元素（例如，修改数组元素，或添加或删除元素），则父项和子项都“看到”更改，因为更改发生在同一对象/一个对象上。

如果在父对象中分配新数组，则角度更改检测会将新数组引用向下传播到子对象，因为这是子对象的输入属性。

但是，如果在子级中分配新数组，则父级仍将具有对原始数组的引用。 角度变化检测对您无济于事。 您将必须例如使用EventEmitter通知父有关此新数组。