在Angular中，可以通过添加清除操作函数来取消已选择的Mat表单选项值。以下是一个示例代码，可以根据您的实际需求进行调整。

.ts文件代码示例：

import { Component, OnInit } from '@angular/core';
import { FormControl } from '@angular/forms';

@Component({
  selector: 'app-clear-selection',
  templateUrl: './clear-selection.component.html',
  styleUrls: ['./clear-selection.component.scss']
})
export class ClearSelectionComponent implements OnInit {
  selectedValue: string;
  fruits = new FormControl();

  fruitList: any = [
    { id: 1, name: 'Apple' },
    { id: 2, name: 'Banana' },
    { id: 3, name: 'Grapes' },
    { id: 4, name: 'Mango' },
  ];

  constructor() { }

  ngOnInit() {
  }

  clearSelection() {
    this.selectedValue = '';
    this.fruits.reset();
  }
}

.html文件代码示例：

Clear Mat Select Value in Angular


  
    {{ fruit.name }}
  



  Clear Selection


Selected Value: {{ selectedValue }}

在上述代码中，我们在组件中声明了一个名为“selectedValue”的字符串变量，该变量用于存储所选择的水果的ID。同时，我们还创建了一个FormControl对象以管理水果选择的状态，并设置一个“fruitList”数组，该数组包含可用的水果列表。最后，我们在HTML模板中为“”添加一个“selectionChange”事件，以便在选择发生变化时更新选定值。

清除函数“clearSelection()”可以重