Angular 2双向数据绑定不起作用 [英] Angular 2 two way data binding not working

问题描述

我在使自定义双向数据绑定无法在Angular 2中工作时遇到了麻烦.文档显示盒子模型中的香蕉-[()]只是合成糖，但是在我的示例中，这种方式不起作用较长的方法有效:

I'm having trouble getting custom two way data binding to work in Angular 2. The Docs indicate that the banana in a box model - [()] is just syntatic sugar, however in my example this way doesn't work and the longer method works:

<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 ---

The @Output event is not changing the parent value in the banana in a box model (first line). As the second line works I don't see what I am doing wrong. Here is a link to the docs: https://angular.io/guide/template-syntax#two-way-binding---

这是我为展示这种行为而创建的一个监听器: https://embed.plnkr.co/eTfkQmRfBRxeKCEpGdzh/

Here is a plunker I have created to showcase this behavior:https://embed.plnkr.co/eTfkQmRfBRxeKCEpGdzh/

对于可能的重复项，这是一个不同的问题，因为此问题不会产生任何错误，而且它是双向绑定格式的更简单和本地化的问题.

This is a different question to a possible duplicate because this question does not produce any errors, plus it is a much more simple and localised problem with the formatting of two way bind.

推荐答案

这是因为在文档中编写check_send时需要testChange，而Angular则使用xxxChange语法对代码进行编码./p>

It's because check_send needs to be testChange as it is written in the documentation, Angular de-sugars that code with a 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://plnkr.co/edit/zGupQPkS6MoV3xMQefxN?p=info

这篇关于Angular 2双向数据绑定不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！