Unable to use 'allowEdit' property of DatePicker in Angular 6

Question

Hi,I'm trying to use the allowEdit property of ejs-datepicker in Angular 6, as mentioned in the documentation i.e [allowEdit]='false'. But it gives error 'Can't bind to 'allowEdit' since it isn't a known property of 'ejs-datepicker'.'Regards,Mehmood

Deepa Loganathan · Answer

Hi Mehmood,  
 
Thank you for contacting Syncufsion support.  
 
We have analyzed the reported issue “Can't bind to 'allowEdit' since it isn't a known property of 'ejs-datepicker’” and this issue usually occurs if the DatePickerModule was not imported in the module.ts file.  
 
So please check if the DatePickerModule is properly imported in the app.module.ts file as given in the below code. 
 
 
@NgModule({ 
    imports: [HttpModule, JsonpModule, BrowserModule,TimePickerModule, DatePickerModule], 
declarations: [DataBindingDropDownListComponent], 
bootstrap: [DataBindingDropDownListComponent] 
}) 
 
 
For your reference, we have prepared a sample with Datepicker component and is available in the following link.  
 
https://stackblitz.com/edit/angular-szvkj2-cnxwsg?file=app.module.ts 
 
Please check this and let us know if you have any further concerns. 
 
Regards,  
Deepa L.

Mehmood Ahmed · Answer

Hi Deepa,DatePickerModule is properly imported in the app.module.ts file. In fact, I'm using other ejs-datepicker properties as well, like min, max, enabled etc and these are working fine, the problem is only with allowEdit property. I have attached the html.

Deepa Loganathan · Answer

Hi Mehmood, Thanks for the update. The allowEdit property of Datepicker was introduced in the version 16.2.46. So, the possible cause of the reported issue should be that the old version of packages is being used in your application. So, please update the Syncfusion NPM packages to the latest EJ version to resolve the issue at you end. For your information, the sample which we provided in our previous update has referred the latest Syncfusion NPM packages. Please follow the below steps to update the Syncfusion NPM package version installed in your application. In your application, Open the package.json file. You can find the Syncfusion packages installed in your application in that file. Delete the file package-lock.json, if exist in your application. The names of angular NPM packages of our Angular EJ2 components has been renamed in our latest version v16.3.0.21. npm update command will upgrade to the latest version of packages and it will not rename the packages. So, we request you to remove the 'ej2-ng-[components]' from the node_modules directory and install the 'ej2-angular-[components]' components, using the following command. npm install @syncfusion/ej2-angular-components –save For calendar components: npm install @syncfusion/ej2-angular-calendars --save While updating our Nuget packages, there are possibilities to have duplicate packages as @syncfusion/ej2-angular- instead of@syncfusion/ej2-ng- in your modules. So, to get rid of the duplicate packages after updating, we suggest running the below command from your command prompt. npm dedupe This would remove duplicate packages present, if any. Also, refer the following link to know more about upgrading Syncfusion packages. Upgrading Syncfusion package: https://ej2.syncfusion.com/angular/documentation/base/package.html Please, let us know if you need any further assistance. Regards, Deepa L.