如何在表单中发送mat-chip-list

在表单中发送 mat-chip-list，您可以按照以下步骤进行操作：

首先，确保您已经在项目中引入了 Angular Material 库，以便使用 mat-chip-list 组件。
在表单中创建一个 mat-chip-list 元素，可以使用 Angular 的表单模块来处理表单数据。例如：

<form [formGroup]="myForm">
  <mat-form-field>
    <mat-chip-list formControlName="chips">
      <mat-chip *ngFor="let chip of myForm.get('chips').value" [removable]="true" (removed)="removeChip(chip)">
        {{ chip }}
        <mat-icon matChipRemove>cancel</mat-icon>
      </mat-chip>
    </mat-chip-list>
    <input type="text" placeholder="Add chip" [matChipInputFor]="chipList" [matChipInputSeparatorKeyCodes]="separatorKeysCodes"
      [matChipInputAddOnBlur]="true" (matChipInputTokenEnd)="addChip($event)">
  </mat-form-field>
</form>

在组件类中，创建一个表单控件来处理 mat-chip-list 的值。例如：

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

@Component({
  selector: 'app-my-component',
  templateUrl: './my-component.component.html',
  styleUrls: ['./my-component.component.css']
})
export class MyComponentComponent implements OnInit {
  myForm: FormGroup;

  constructor(private formBuilder: FormBuilder) { }

  ngOnInit() {
    this.myForm = this.formBuilder.group({
      chips: new FormControl([])
    });
  }

  addChip(event: any): void {
    const input = event.input;
    const value = event.value;

    if ((value || '').trim()) {
      const chips = this.myForm.get('chips').value;
      chips.push(value.trim());
      this.myForm.get('chips').setValue(chips);
    }

    if (input) {
      input.value = '';
    }
  }

  removeChip(chip: string): void {
    const chips = this.myForm.get('chips').value;
    const index = chips.indexOf(chip);

    if (index >= 0) {
      chips.splice(index, 1);
      this.myForm.get('chips').setValue(chips);
    }
  }
}