Topic: Disable datepicker
tano pro asked 5 years ago
Actual behavior In case I want to set disable state I got an exception Cannot read property 'nativeElement' of undefined. I've found the cause. There's an ngIf='!inline' which cause that the dateInput is not initialized correctly, so you should use viewchildren instead of viewchild or [hidden] instead of ngif
Thanks
Damian Gemza staff answered 5 years ago
Okay, now I see this. Thanks for your report!
We'll resolve this problem soon.
Best Regards,
Damian
tano pro answered 5 years ago
I use reactive form, nothing special:
<mdb-date-picker mdbValidate formControlName="date"></mdb-date-picker>
ts:
new FormControl({ value, disabled:true })
The exception is thrown from MDBDatePickerComponent setDisabledState method since the this.dateInput is undefined what is reasonable. The template:
<div class="mydp picker" [ngClass]="{'picker--opened': showSelector}" [ngStyle]="{'width': opts.width}" *ngIf="!inline">
you can't use @ViewChild('dateInput') dateInput: ElementRef; because of the *ngIf="!inline". You should use ViewChildren which is initialized in afterviewinited phrase. or use setter
@ViewChild('dateInput')
set dateInputField(value){
this.dateInput = value;
}
Damian Gemza staff answered 5 years ago
Dear @tano
Please attach the code which you're using, and causes you problems - We don't know if you're using the Datepicker disabled property, or native element disabled.
Best Regards,
Damian
Arkadiusz Idzikowski staff answered 5 years ago
Hello,
How can we reproduce this problem? How do you add the disabled state to the date picker component?
tano pro commented 5 years ago
Hi,
Simply set disabled during declaration new FormControl({ value, disabled }, question.validators) or in ngAfterViewInit.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- ForumUser: Pro
- Premium support: No
- Technology: MDB Angular
- MDB Version: 7.5.0
- Device: PC
- Browser: Chrome
- OS: Win10
- Provided sample code: No
- Provided link: No