I have an array of CheckBox defined as follows:
Component.ts
export class dashboardComponent {
get boardTypeFormArray(){
return this.boardDashboardForm.controls.boardType as FormArray;
}
addCheckBoxes(){
this.lkBoardTypeList.forEach(() => this.boardTypeFormArray.push(new FormControl(false)));
}
constructor(){
this.boardDashboardForm = new FormGroup({});
this.boardDashboardForm = this.formBuilder.group({
boardType: new FormArray([])
});
this.addCheckBoxes();
}
saveBoard(obj){
const selectedBoardType = this.boardDashboardForm.value.boardType
.map((checked, i) => checked ? this.lkBoardTypeList[i].id : null).filter(v => v !== null);
}
}
HTML code looks like
<div class="form-group" >
<div formArrayName="boardType" *ngFor="let c of boardTypeFormArray.controls; let i = index">
<input class="col-sm-1" type="checkbox" [formControlName]="i"/>
<span class="col-sm-5" ></span>
</div>
</div>
this works perfectly fine and when checked saveBoard() gives me checked items. I now have a requirement to check/uncheck the checkboxes based on dropdown values. So i have added this code to (onChange) of dropdown as follows:
loadCheckBoxes(event){
this.bService.getbTypeById(event.value).subscribe( posts =>{
this.data = posts;
},
error => {
this._errorService.handleError(error);
},
() => {
this.boardTypeByIdList = this.data.boardTypes;
for (let i = 0; i < this.lkBoardTypeList.length; i++) {
onsole.log(this.lkBoardTypeList[i].id);
this.boardTypeFormArray.push(new FormControl(true));
}
});
}
This is adding me another set of checkboxes and checks the corresponding box. I know I shouldnt do this push
this.boardTypeFormArray.push(new FormControl(true));
But want to know how to do this check/uncheck. Can someone help with the script please? thank you.
Aucun commentaire:
Enregistrer un commentaire