html - 以 Angular 提交数据后如何清除输入字段？

Question

我有一个 mat-select 下拉列表和一个 input 字段。单击按钮 时，它会提交数据。提交数据后，我想清除输入字段，但不想清除 mat-select 下拉列表。我该怎么做？

聊天组件.html

<div>
  <mat-form-field>
    <mat-select placeholder="Select User" [(ngModel)]="userObject.userid" 
      name="userid" required>
      <mat-option *ngFor="let userObj of userObj [value]="userObj.userid">
        {{userObj.username}}
      </mat-option>
    </mat-select>
  </mat-form-field>  

  <mat-form-field>
    <input matInput placeholder="Type Message" [(ngModel)]="userObject.chatmessage">
  </mat-form-field>

  <button mat-raised-button color="primary" (click)="sendMessage()">
    SEND MESSAGE</button>
</div>

Answer 1

由于您是双向数据绑定(bind)到 userObject.chatmessage，因此只需在您的组件中将其设置为空字符串即可。

在您的 ChatComponent TypeScript 类中，只需执行以下操作:

sendMessage() {
  // After Sending Message
  userObject.chatmessage = '';
}