Question

我有一个带有2个下拉菜单的表单，用于过滤。

<form [formGroup]="filterForm">
    <mat-form-field>
        <mat-label>Equipment Class</mat-label>
        <mat-select FormControlName="equipmentClass">
            <mat-option *ngFor="let class of equipmentService.equipmentClasses" [value]="class">
                {{class.description}}
            </mat-option>
        </mat-select>
    </mat-form-field>
    <div *ngIf="true">
        <mat-form-field>
            <mat-label>Equipment </mat-label>
            <mat-select FormControlName="equipment">
                <mat-option *ngFor="let equipment of equipmentService.equipments" [value]="equipment">
                    {{equipment.description}}
                </mat-option>
            </mat-select>
        </mat-form-field>
        <button mat-button (click)="newEquipment()">Create New</button>
    </div>
</form>

formGroup在我的控制器中声明为：

filterForm = new FormGroup({
  equipmentClass: new FormControl(''),
  equipment: new FormControl(''),
});

我想听听两个下拉菜单的变化。因此，在ngOnInit中，我同时订阅了两个formControls的valueChanges发射器。

ngOnInit() {
  this.filterForm.get('equipmentClass').valueChanges.subscribe((value) => {
    console.log(value);
  });
  this.filterForm.get('equipment').valueChanges.subscribe((value) => {
    console.log(value);
  });
}

但是，当用户在下拉列表中进行选择时，永远不会记录该值，因为永远不会调用该函数。

看来我已经完成了所有工作according to the documentation。非常感谢您的帮助，因为这是我第一次使用ReactiveForms。

角度：未为FormControl触发ValueChanges

0 个答案: