fetrarij / ngx-daterangepicker-material

Pure Angular 2+ date range picker with material design theme, a demo here:
https://fetrarij.github.io/ngx-daterangepicker-material/
MIT License
246 stars 247 forks source link

inline usage throws an error ERROR TypeError: dir.valueAccessor.writeValue is not a function #527

Open VolodymyrL87 opened 1 year ago

VolodymyrL87 commented 1 year ago

Versions

Describe the bug When inline component is used with [(ngModel)] or formControl, there is error in console: ERROR TypeError: dir.valueAccessor.writeValue is not a function at setUpControl (forms.mjs:2939:23) at FormControlDirective.ngOnChanges (forms.mjs:4551:13) at FormControlDirective.rememberChangeHistoryAndInvokeOnChangesHook (core.mjs:1521:14) at callHook (core.mjs:2444:18) at callHooks (core.mjs:2403:17) at executeInitAndCheckHooks (core.mjs:2354:9) at refreshView (core.mjs:10341:21) at refreshComponent (core.mjs:11385:13) at refreshChildComponents (core.mjs:10116:9) at refreshView (core.mjs:10376:13)

To Reproduce Steps to reproduce the behavior:

  1. Create a component with <ngx-daterangepicker-material [formControl]="control"></ngx-daterangepicker-material> or <ngx-daterangepicker-material [(ngModel)]="range"></ngx-daterangepicker-material> where control is``` new FormControl( { endDate: new Date(), startDate: new Date(), } )

2. OPen browser console
**Expected behavior**
there is no errors in console

**Screenshots**
![image](https://github.com/fetrarij/ngx-daterangepicker-material/assets/133101541/88766c89-82db-4395-bc53-c6656cca7fbe)

**Stackblitz link**
If applicable, add stackblitz link.

**Additional context**
Add any other context about the problem here.
YogeshK05 commented 3 months ago

Hello @VolodymyrL87,

I also encountered the same issue. I think the problem is you can't use formControl or ngModel with the inline component. What you can do instead is you can listen to the event choosedDate which is emitted when you select a date.

<ngx-daterangepicker-material (choosedDate)="choosedDate($event)"> </ngx-daterangepicker-material>