根据ngIf条件清除输入值

Question

我想使用formcontrol来比较我的值，而不是ngModel，当在输入框中输入值时，我想显示我的取消图像，所以我给了userTextValue作为在订阅内部为true时，我的查询现在是单击取消时如何重置值。我希望输入框为空，现在隐藏了“取消”按钮，但仍然有可用值，我正在使用管道过滤值。

<input matInput class="form-control input" placeholder="Enter name or Id" id="user"
    [formControl]="userControl"[matAutocomplete]="auto>
       <img src="assets/icons/cancel.svg" *ngIf="userTextvalue" class="cancel-icon" 
        aria-label="Clear" (click)="clearUserValues()">

ts：

  constructor() {
    this.userControl.valueChanges.subscribe((user) => {
      this.filterResult = user;
      this.userTextvalue = true;
    });
  }
  clearUserValues() { 
    this.filterResult = "";
    this.userTextvalue = false;
  }

pipe.ts

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'filterUser'
})
export class FilterUserPipe implements PipeTransform {

  transform(items: any[], searchText: string): any[] {
    if (searchText && searchText.length > 1) {
      items = searchText ? this.filterUsers(items, searchText) : items.slice();
    } else {
      items = [];
    }
    return items;
  }

  filterUsers(items: any[], value: string): any[] {
    const filterValue = value.toLowerCase();
    return items.filter(item => item.name.toLowerCase().indexOf(filterValue) === 0);
  }

}