单击时清除角度材质自动完成

您好，我想在单击时重置角度材料自动完成的值 但我不知道怎么办。

我的代码：

  <mat-form-field>
        <input type="text" placeholder="Give Rights" formControlName="selectedOption" aria-label="User" matInput  [matAutocomplete]="auto" (input)="onSearchChange($event.target.value)">
        <mat-autocomplete #auto="matAutocomplete">
            <mat-option *ngFor="let user of users" [value]="user.displayName" (onSelectionChange)="setSelectedUser($event, user)">
                {{ user.displayName }}
            </mat-option>
        </mat-autocomplete>
        <button (click)="resetValue($event)">RESET</button>
    </mat-form-field>

TS :

    this.nameForm = this._formBuilder.group({
    selectedOption: new FormControl()
});    

    resetValue(){
    console.log("Value -> ", this.nameForm.value.selectedOption);
    this.nameForm.value.selectedOption = "test";
}

你能帮助我吗 ？

首先，您需要获取要设置其值的控件的句柄，可以使用 FormGroup 的 get 方法来完成此操作

nameForm.get('selectedOption')

然后你可以简单地调用Reactive Forms提供的setValue方法来设置 那个控制。

<button (click)="nameForm.get('selectedOption').setValue('')">RESET</button>