全社員を表示して欠勤を確認し、欠勤者を返したい
これは私のフォームです:
<!-- Modal body -->
<div class="modal-body" >
<form [formGroup]="attendanceForm">
<div class="row">
<table class="table table-hover table-condensed text-center table-bordered">
<thead>
<tr>
<th> Names </th>
<th> Attendance </th>
</tr>
</thead>
<tbody>
<tr *ngFor="let attendance of attendances">
<td > {{attendance.Emp_Name}} </td>
<td>
<div class="form-check">
<label class="form-check-label">
<input type="checkbox (change)="onChange(attendance.isAttend,$event.target.checked)" >{{attendance.isAttend}}
</label>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-success" (click)="onattendanceSave(attendanceForm.value)"> Save </button>
</div>
</form>
component.ts:
this.attendanceForm = this.fb.group({
'isAttend' : this.fb.array([])
})
onattendanceSave(form:NgForm){
console.log(this.attendanceForm.value);
}
onChange(attendance:string, isChecked: boolean) {
const attendanceFormArray = <FormArray>this.attendanceForm.controls.isAttend;
if(isChecked) {
attendanceFormArray.push(new FormControl(attendance));
} else {
let index = attendanceFormArray.controls.findIndex(x => x.value == attendance)
attendanceFormArray.removeAt(index);
}
}
私はすべての従業員 (attendance.Emp_Name) を表示し、各従業員の横に彼の checbox を表示しました。彼が不在の場合はチェックします.. Angular 4 を使用してチェックされた従業員のみを返すにはどうすればよいですか? 現在 isAttend ログが null