Switch to reactive forms in schedule module.

This commit is contained in:
Alexis Lahouze
2017-08-11 23:15:07 +02:00
parent 1f896e1a40
commit 0600c1b653
3 changed files with 163 additions and 44 deletions

View File

@ -1,10 +1,10 @@
// vim: set tw=80 ts=2 sw=2 sts=2:
import { Component, Input } from '@angular/core';
import { NgForm } from '@angular/forms';
import { Component, Input, ViewChild } from '@angular/core';
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
import { Schedule } from './schedule';
import { ScheduleFormComponent } from './scheduleForm.component';
@Component({
selector: 'schedule-edit-modal',
@ -14,11 +14,11 @@ import { Schedule } from './schedule';
</div>
<div class="modal-body" id="modal-body">
<schedule-form [(schedule)]="schedule" (onValid)="valid=$event"></schedule-form>
<schedule-form [schedule]="schedule" (submit)="submit()" #scheduleForm="scheduleForm"></schedule-form>
</div>
<div class="modal-footer">
<button class="btn btn-primary" [disabled]="!valid" (click)="submit()">
<button class="btn btn-primary" [disabled]="!scheduleForm.form.valid" (click)="submit()">
Save
</button>
@ -30,6 +30,7 @@ import { Schedule } from './schedule';
})
export class ScheduleEditModalComponent {
@Input() schedule: Schedule;
@ViewChild('scheduleForm') scheduleForm: ScheduleFormComponent;
valid: boolean = false;
@ -44,7 +45,19 @@ export class ScheduleEditModalComponent {
}
submit(): void {
this.activeModal.close(this.schedule);
let formModel = this.scheduleForm.form.value;
let schedule = new Schedule();
schedule.id = this.schedule.id;
schedule.start_date = formModel.startDate;
schedule.stop_date = formModel.stopDate;
schedule.day = formModel.day;
schedule.frequency = formModel.frequency;
schedule.label = formModel.label;
schedule.value = formModel.value;
schedule.category = formModel.category;
this.activeModal.close(schedule);
}
cancel(): void {