角度2中的双向数据绑定 [英] two way data binding in angular 2

问题描述

最近我对第2个角度保持安静，并在双向数据绑定方面大跌眼镜.这是混乱的地方:

 < input(input)=用户名= $ event.target.value" id =测试">< p> {{username}}</p> 

这很好地达到了目的.数据绑定似乎已经是两种方式.我可以在组件内部访问用户名，并且input元素的value属性也将更新.为何我当时完全需要[]?这里的两种方式绑定是什么?组件内部有什么，组件内部有什么.

免责声明:我知道这是一个非常幼稚且看似愚蠢的问题:|

解决方案

此处说明了角度2数据绑定./p>

在输入中输入以下内容时，将执行:"username = $ event.target.value"，这将为变量用户分配您输入的值.

这意味着以下html会执行相同的操作:

• [(ngModel)] =用户名"
• [用户名] =用户名"(输入)="updateUserName()"
• (input)=用户名= $ event.target.value" 和 {{userName}}

I am quiet recent to angular 2 and was bumping my head around two way data binding. Here is the confusion:

  <input  (input)="username = $event.target.value" id="testing">
  <p>{{username}}</p>

This serves the purpose well. It already seems to be two way data binded. I can access username inside the component and the value property of the input element is updated as well. Why do i need [ ] at all then? What is the two way binding here? what goes inside the component and what comes out of the component.

Disclaimer: I know it's a very naive and seemingly stupid question :|

解决方案

Angular 2 data binding is explained here.

When you write in the input you execute: "username = $event.target.value", wich assigns to the variable user the value you enter.

That means that the following html does the same:

• [(ngModel)]="username"
• [username]="username" (input)="updateUserName()"
• (input)="username = $event.target.value" and {{userName}}

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