不能从angular2中的子组件指定父组件中的数组
Array in parent component cannot be assigned from a child component in angular2
对此可能有一个简单的解释,所以请原谅我的无知。
当使用来自子组件的数组并对传递的值使用.pop()
、.splice()
、.push()
时,它会很好地保持父数组值,但当我尝试赋值(=
)时,它不会将数组保持在父组件中。
我在Plunker上创建了一个简单的例子。
该程序有3个按钮,清除、弹出和重新加载。
清除列表-将@Input list
分配给一个空数组(this.list = []
)。注意,父组件计数器不会更改
Pop-在列表上执行.pop()
。请注意,父零部件计数器发生了更改。
为什么我不能简单地分配数组值?
我知道可以使用
EventEmitter
并让家长监听事件并以这种方式进行更新。我正在努力理解这一点场景,看看我是否可以避免额外的代码。
父对象和子对象都有对同一个/one数组对象的引用。因此,如果您更改数组的元素(例如,修改数组元素,或添加或删除元素),父对象和子对象都会"看到"这些更改,因为这些更改发生在同一个对象上。
如果在父对象中指定一个新数组,角度变化检测将把新数组引用向下传播到子对象,因为这是子对象的输入属性。
但是,如果在子数组中指定新数组,则父数组仍将具有对原始数组的引用。角度变化检测对您没有帮助。您必须将这个新数组通知父数组,例如,使用EventEmitter。
相关文章:
- 不能从angular2中的子组件指定父组件中的数组
- 从组件状态的数组中删除元素
- 将ember对象的数组从ember组件传递到模板
- 如何在cycle js中从JSON数组创建组件
- 使用数据数组创建多个类似组件
- 如何创建独立于数组更新的组件列表
- 访问要在 React Native Text 组件中显示的对象数组
- React:用CSS类标记数组中的活动组件
- 如何在 Vue.js 中保持可排序的数组和组件的顺序
- 使用 React 将数组导出为组件属性
- 如何使用组件从 vuejs 中获取纯数组
- 对React Native中从父组件传下来的props数组进行更改
- ReactJS中使用非子组件的子数组唯一键
- 聚合物网络组件数据绑定一个js对象/数组
- 如何访问foreach中Knockout组件中的数组成员
- React不能从组件中渲染数组
- Angular2 -在路由和渲染组件之前,通过service获取数组
- #每个循环不检测组件中定义的数组
- 从react组件'数组类型状态属性弹出的正确方式
- Mithril.js:为什么“组件模板必须返回一个虚拟元素,而不是数组、字符串等”?的意思