Angular 10 Angular 材质复选框数组未传递值

Question

我的应用程序是 Angular 10，我的表单是反应式我在我的应用程序中实现了复选框数组，它没有传递值。当我检查复选框并提交我的表单时，它没有传递检查天的值。

我的组件.ts

 this.holidayForm= this._formBuilder.group({
    RepeatTypeID: ['', null],
    SelectedWeekDays: new FormArray([]),
  });

我的组件 html

  <div  *ngFor="let wdItems of WeekDays; let i=index">
            <mat-checkbox formArrayName="SelectedWeekDays" [value]="wdItems.Weekdayid" >{{wdItems.Weekdayname}}</mat-checkbox>
          </div>

Answer 1

基于this article:

像这样创建一个 FormArray：

this.fg = new FormGroup({
   optionControls: new FormArray([
      new FormControl(true),
      new FormControl(false),
   ])
})

根据这些控件呈现选项：

  <div *ngFor=”let optionControl of fg.optionControls; let i=index”>
   <input type=”checkbox” [formControl]=”optionControl”/> {{  myOriginalArray[i].someProperty }}
  </div>

现在fg.optionControls.value 是一个布尔值数组。例如：[true, false]。 如果这还不够，您可以继续将此数据结构转换为满足您需求的格式。

祝你好运，希望能帮到你。