Angular 2 双向数据绑定不起作用

2024-01-30

我在 Angular 2 中获取自定义双向数据绑定时遇到问题。文档表明盒子模型中的香蕉 - [()] 只是语法糖,但是在我的示例中,这种方式不起作用,而且时间更长方法的工作原理:

<child-component [(test)]="check">This child updates only itself</child-component>
<child-component [test]="check" (check_send)="check=$event">This child updates all</child-component>

@Output 事件不会更改盒模型中香蕉的父值(第一行)。 当第二行工作时,我看不出我做错了什么。 这是文档的链接:https://angular.io/guide/template-syntax#two-way-binding--- https://angular.io/guide/template-syntax#two-way-binding---

这是我创建的一个 plunker 来展示这种行为:https://embed.plnkr.co/eTfkQmRfBRxeKCEpGdzh/ https://embed.plnkr.co/eTfkQmRfBRxeKCEpGdzh/

编辑:这是一个与可能重复的问题不同的问题,因为这个问题不会产生任何错误,而且它是双向绑定格式的一个更简单和本地化的问题。


这是因为check_send需要是testChange正如文档中所写,Angular 对使用以下代码的代码进行了脱糖处理:xxxChange syntax.

<child-component [test]="check" (testChange)="check=$event">This child updates all</child-component>

@Output() testChange = new EventEmitter<number>();

this.testChange.emit(this.test);

修复了堆栈闪电战:https://stackblitz.com/edit/angular-ivy-165fvb?file=src%2Fapp%2Fapp.component.ts https://stackblitz.com/edit/angular-ivy-165fvb?file=src%2Fapp%2Fapp.component.ts

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Angular 2 双向数据绑定不起作用 的相关文章

随机推荐