我正在用筹码创建表格。因此,我必须在表单的输入字段中将所有选定的芯片作为数组获取。但是,我只得到最后一个值作为输入。我是stackoverflow的新手。请忽略任何错误。
Blockquote .html文件
<div class="dialog-content-wrapper">
<mat-toolbar matDialogTitle class="mat-accent m-0">
<mat-toolbar-row fxLayout="row" fxLayoutAlign="space-between center">
<span class="title dialog-title">{{dialogTitle}}</span>
<button mat-icon-button (click)="_matDialogRef.close()" aria-label="Close dialog">
<mat-icon>close</mat-icon>
</button>
</mat-toolbar-row>
{{chapter.name}} {{chapter.lastName}}
<div mat-dialog-content class="p-24 m-0" fusePerfectScrollbar>
<form [formGroup]="courseForm">
<div class="mb-24" fxLayout="row" fxLayoutAlign="start start">
<mat-form-field fxFlex>
<mat-icon matPrefix class="mr-12 s-20 secondary-text">account_circle</mat-icon>
<input name="name" formControlName="name" placeholder=" Course Name" matInput required>
</mat-form-field>
</div>
<div class="mb-24" fxLayout="row" fxLayoutAlign="start start">
<mat-form-field fxFlex>
<mat-icon matPrefix class="mr-12 s-20 secondary-text">account_circle</mat-icon>
<input name="subject" formControlName="subject" placeholder=" Subject Name" matInput required>
</mat-form-field>
</div>
<div class="mb-24" fxLayout="row" fxLayoutAlign="start start">
<mat-form-field fxFlex>
<mat-icon matPrefix class="mr-12 s-20 secondary-text">account_circle</mat-icon>
<input name="description" formControlName="description" placeholder=" Description" matInput required>
</mat-form-field>
</div>
<div class="mb-24" fxLayout="row" fxLayoutAlign="start start">
<mat-form-field class="example-chip-list">
<mat-chip-list #chipList>
<mat-chip
*ngFor="let teacher of teachers"
[selectable]="selectable"
[removable]="removable"
(removed)="removeteacher(teacher)">
{{teacher}}
<mat-icon matChipRemove *ngIf="removable">cancel</mat-icon>
</mat-chip>
<input
placeholder="New Teacher..."
#teacherInput
formControlName = "teacher"
[matAutocomplete]="auto"
[matChipInputFor]="chipList"
[matChipInputSeparatorKeyCodes]="separatorKeysCodes"
[matChipInputAddOnBlur]="addOnBlur"
(matChipInputTokenEnd)="add($event)">
</mat-chip-list>
<mat-autocomplete #auto="matAutocomplete" (optionSelected)="selected($event)">
<mat-option *ngFor="let teacher of filteredTeachers | async" [value]="teacher">
{{teacher}}
</mat-option>
</mat-autocomplete>
</mat-form-field>
<!-- <pre>{{teachers|json}}</pre> -->
</div>
</form>
</div>
<div mat-dialog-actions class="m-0 p-16" fxLayout="row" fxLayoutAlign="space-between center">
<button *ngIf="action !=='edit'" mat-raised-button (click)="_matDialogRef.close(courseForm)" class="save-button mat-accent"
[disabled]="courseForm.invalid" aria-label="SAVE">
SAVE
</button>
<button *ngIf="action ==='edit'" mat-raised-button (click)="_matDialogRef.close(courseForm)" class="save-button mat-accent"
[disabled]="courseForm.invalid" aria-label="SAVE">
SAVE
</button>
<!-- <button *ngIf="action ==='edit'" mat-icon-button (click)="_matDialogRef.close(['delete',chapterForm])" aria-label="Delete"
matTooltip="Delete">
<mat-icon>delete</mat-icon>
</button> -->
</div>
`
Blockquote .component文件
createCourseForm(): FormGroup {
return this._formBuilder.group({
name: ['', Validators.required],
subject: [''],
description: [''],
teacher: [''],
// students: [this.course.students],
});