DateTimePicker not working in Material Modal

YassinRekikVeolia commented 6 years ago

Hello,

I migrate my project from angular 5 to 6 and i have an issue. I have a datetimepicker in a material Dialog Modal. And now it doesn't work as before, in chrome console i had that issue every time i click on the datetimepicker.

OwlDateTimeContainerComponent.html:1 ERROR TypeError: Cannot read property 'subscribe' of undefined
    at new OwlCalendarComponent (calendar.component.js:32)
    at createClass (core.js:9304)
    at createDirectiveInstance (core.js:9179)
    at createViewNodes (core.js:10399)
    at createEmbeddedView (core.js:10307)
    at callWithDebugContext (core.js:11344)
    at Object.debugCreateEmbeddedView [as createEmbeddedView] (core.js:10845)
    at TemplateRef_.push../node_modules/@angular/core/fesm5/core.js.TemplateRef_.createEmbeddedView (core.js:8894)
    at ViewContainerRef_.push../node_modules/@angular/core/fesm5/core.js.ViewContainerRef_.createEmbeddedView (core.js:8760)
    at NgIf.push../node_modules/@angular/common/fesm5/common.js.NgIf._updateView (common.js:3375)

And this is my config:

"dependencies": {
    "@angular-devkit/core": "0.8.4",
    "@angular/animations": "^6.1.9",
    "@angular/cdk": "^6.4.7",
    "@angular/common": "^6.1.9",
    "@angular/compiler": "^6.1.9",
    "@angular/core": "^6.1.9",
    "@angular/forms": "^6.1.9",
    "@angular/http": "^6.1.9",
    "@angular/material": "^6.4.7",
    "@angular/platform-browser": "^6.1.9",
    "@angular/platform-browser-dynamic": "^6.1.9",
    "@angular/router": "^6.1.9",
    "@types/googlemaps": "^3.30.13",
    "ajv": "^6.5.4",
    "core-js": "^2.5.7",
    "ng-gapi": "0.0.44",
    "ng-pick-datetime": "6.0.16",
    "rxjs": "^6.3.3",
    "rxjs-compat": "^6.3.3",
    "rxjs-tslint": "^0.1.5",
    "zone.js": "^0.8.26"
  }

How can i fix the problem please ?

YassinRekikVeolia commented 6 years ago

i solve my problem when i downgrade the version of datetimepicker from 6.0.16 to 6.0.0. But i don't know why it's not working with the latest version

oquas commented 6 years ago

I have the exact same problem. The last version that worked for me was v6.0.7. Since then, every release of ng-pick-datetime failed to fix the issue (or at least provide any other workaround/solution). Now, that Angular 7 is released, v6.0.7 still works, although i'd prefer to upgrade to v7.0.0. But as long as the error described by @YassinRekikVeolia still occurs, i'm kinda lost. I checked the necessary imports and usage by comparing to the docs several times, but no solution other than downgrading again. In the end, i always get an empty dialog without the date picker and the error message above.

Although this is one of the more comprehensive implementations of a date picker, i am thinking about removing this package and looking for an alternative. I would change my mind if this project would be handled more professionally (by using the github-releases feature, a changelog like Angular has, faster responses to issues, semantic versioning, improved customizability of styles, …).

jonathanamigo commented 6 years ago

{ provide: OwlDateTimeIntl, useClass: DatetimeLocaleCustomService }

In my case the problem was that my custom OwlDateTimeIntl provider didn't extend OwlDateTimeIntl

oquas commented 6 years ago

Thanks so much @jonathanamigo That did the trick! Don't know how i missed to subclass OwlDateTimeIntl.

DanielYKPan / date-time-picker

DateTimePicker not working in Material Modal #495