angular7学习笔记（4)——angular数据双向绑定

每天积累一点

---

1、html

<div class="ui-inputgroup">
        <span class="ui-inputgroup-addon"><i class="fa fa-user"></i></span>
        <input type="text" pInputText placeholder="Sender" [(ngModel)]='sender'> 
        {{sender}}    
    </div>

理解ngModel：

ngModel实际上由属性绑定和事件绑定两部分构成。它的完整写法如下：

<input [ngModel]="username" (ngModelChange)="username = $event">
<p>Hello {{username}}!</p>

属性绑定[ngModel]只关心如何更新当前DOM元素，事件绑定(ngModelChange)通知外部世界DOM值发生改变。

2、对应的ts文件

定义变量

 public sender;//发送者

3、测试