4.5 - 双向数据绑定

• 数据在组件类和组件模板中双向同步
• Angular 将双向数据绑定功能放在了 @angular/forms 模块中，所以要实现双向数据绑定需要依赖该模块

  引入 FormsModule 模块

  ```typescript // src/app/app.module.ts import { FormsModule } from ‘@angular/forms’;

@NgModule({ imports: [FormsModule], })

export class AppModule {}

<a name="hWKWN"></a>
### 使用双向数据绑定
```typescript
<input type="text" [(ngModel)]="username" />
<button (click)="change()">在组件类中更改 username</button>
<div>username: {{ username }}</div>

export class AppComponent {
    username: string = ""
    change() {
        this.username = "hello Angular"
    }
}