Question

因此，我在处理表单时尝试尽可能少地编写处理代码，但是这个用例已被证明对我来说是一个障碍（主要是精神上的）。

所以我有一个对象列表，我想将它们分配给一个被动形式的表单控件。最初，不应选择任何可用选项。选择后，应使用简单值（如id: number）或对象本身填充表单控件值。

以下是 component.ts ：

public pageForm: FormGroup;
constructor( private fb: FormBuilder ){}

public ngOnInit(): void {
   this.pageForm = this.fb.group({
     id: [null],
     requestedBy: [ null, Validators.required ],
     requestNote: [ '' ],
     absenceType: [ EnumAbsenceType.vacation, Validators.required ],
     shifts: [ [], Validators.required ]
   });
}

关于最后一个shifts FormControl。

其他控件的 template.html 看起来很简单，即：

<div><input type="text" formControlName="requestNote"></div>

但是我也需要使用复选框显示这个对象数组，以便在选中复选框时，将值传递给ShiftControl。传递的值不应该是true或false，而应该是id或对象本身。我还想避免使用某种(change)="onChange($event)"类型的代码（现在就是这种情况），以便框架负责插入/删除数组。

有什么想法吗？

UPD：仅仅为了可视化，以下是呈现时的样子：

     date           name
-------------------------------------
[ ]  23.05.2018     Max Mustermann
[ ]  24.05.2018     Neymar Jr 
[x]  25.05.2018     Roger Federer
[x]  26.05.2018     Rafael Nadal
[ ]  27.05.2018     Will Smith

因此shifts表单控件值应该有两个Roger Federer和Rafael Nadal的条目

列出Reactive Form中的复选框

0 个答案: