Topic: DatePicker : date displayed is not updated when we set a value programmatically
dimitribocquet pro asked 6 years ago
Hi,
I create a reactive form component with a datePicker field, and try to initiate it with a custom date. But when I do, everything looks good, except the big date displayed.
After some attempts, I found that the "tmp" variable is not updated. I have to update it myself.
Here is my code :
<form [formGroup]="form">
<mdb-date-picker #startedAtPicker id="started_at" name="started_at" formControlName="started_at" [options]="{closeAfterSelect: true}" placeholder="Start At" (dateChanged)="dateChanged($event)"></mdb-date-picker>
<div class="text-center mt-1-half">
<button mdbBtn class="mb-2 waves-light aqua-gradient" data-dismiss="modal" [disabled]="!form.valid" mdbWavesEffect rounded="true" (click)="onSubmit($event)">
<i class="fa fa-plus-circle"></i>
Create
</button>
</div>
</form>
export class MainHarvestCreateModalComponent implements OnInit, OnDestroy {
private form: FormGroup;
@ViewChild('startedAtPicker') startedAtPicker: MDBDatePickerComponent;
constructor(
private _fb: FormBuilder,
) {
this.form = _fb.group({
started_at: [moment().startOf('day').subtract(7, 'days').format('DD/MM/YYYY'), Validators.required],
});
}
ngOnInit() {
// Without this code, the date displayed is today
const startedAtDate = moment().startOf('day').subtract(7, 'days');
this.startedAtPicker.tmp = {
year: startedAtDate.year(),
month: startedAtDate.month() + 1,
day: startedAtDate.date(),
};
}
}
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- User: Pro
- Premium support: No
- Technology: MDB Angular
- MDB Version: -
- Device: -
- Browser: -
- OS: -
- Provided sample code: No
- Provided link: No
Damian Gemza staff commented 6 years ago
Dear dimitribocquet, Thanks for your report. I'll add this to our bugs list, and we'll fix it with future releases of MDB Angular. Best Regards, Damian