从子组件到父组件的绑定字符串字段不起作用

Posted 2023-02-23

【中文标题】从子组件到父组件的绑定字符串字段不起作用

【英文标题】：Binding string field from child to parent component not working

【发布时间】：2016-11-18 18:17:20

【问题描述】：

示例plunk 显示了一个非常简单的页面，其中我们有一个父组件和一个子组件。从父到子我们传递两个值，一个是字符串，另一个是数组。

<child [aList]="sharedList" [aString]="sharedString"></child>

问题是当我更新字符串值时，它只在子组件中更新，而不在父组件中更新。但是，如果我从子组件更新数组值，它将在（子组件和父组件）中更新。

所以我的问题是为什么字符串值不会在父项中从子项更新，但数组值会。我做错了什么。

【参考方案1】：

在 javascript 中，原始类型（字符串、数字等）是不可变的。对象（复杂类型，如数组、对象、函数等）是可变的并通过引用传递。这意味着当您将字符串从父级传递给子级时，您实际上传递了该值的副本，即另一个字符串。

当您稍后更改子元素的原始值时，父元素持有的原始值不会自动更新。

同时，当您传递一个对象（如数组）时，父子节点都将使用对同一对象的引用。对一个的更改会反映在另一个上。

【讨论】：

感谢您的回答。我意识到，从普通的 JavaScript 视图，但在第一个角度，我们可以编写类似 <some-directive myValue="mySharedObject.stringValue"/> 的内容，并且在我们在指令中更改此值之后，这将被更改为控制器。也许问了一个错误的问题（对此感到抱歉），我真正的问题是如何在 Angular 2 中实现这一点。我更新了 plunk 以获得与我的问题更多的相似性。