Datepicker breaks the application on navigation

[ik1728]

Issue type

I'm submitting a ... (check one with "x")

• [ ] bug report Regarding datepicker

Issue description

If we navigate from current page which has datepicker to another page then application breaks.

Current behavior: Navigation from current page containing datepicker to another page breaks application.

Expected behavior: Should not break.

Steps to reproduce: Go to page which has datepicker Navigate away from the page to another page. application breaks

Related code:

insert short code snippets here

<div *ngSwitchCase="'EnrolledDate'" class="input-group">

                          <input nbInput 
                                #enrolledDateFilter
                                [nbDatepicker]="datepicker"
                                >
                          <span class="input-group-addon success" (click)="onEnrolledFilterClicked()"><i class="fas fa-calendar-alt"></i></span>
                        </div>
                        <nb-datepicker #datepicker [max]="max" (dateChange)="onEnrolledDateFilter($event, devicestable)" ></nb-datepicker>
### Other information:

**Browser
Chrome

**Description of Error
core.js:15724 ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'destroy' of undefined
TypeError: Cannot read property 'destroy' of undefined
    at NbDatepickerComponent.push../node_modules/@nebular/theme/components/datepicker/datepicker.component.js.NbBasePicker.ngOnDestroy (datepicker.component.js:146)
    at callProviderLifecycles (core.js:22422)
    at callElementProvidersLifecycles (core.js:22390)
    at callLifecycleHooksChildrenFirst (core.js:22380)
    at destroyView (core.js:23442)
    at callViewAction (core.js:23568)
    at execEmbeddedViewsAction (core.js:23511)
    at destroyView (core.js:23440)
    at callViewAction (core.js:23568)
    at execEmbeddedViewsAction (core.js:23511)
    at resolvePromise (zone.js:814)
    at resolvePromise (zone.js:771)
    at zone.js:873
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:17290)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:420)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:188)
    at drainMicroTaskQueue (zone.js:595)
    at ZoneTask.push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask [as invoke] (zone.js:500)
    at invokeTask (zone.js:1540)

**Angular, Nebular**

 "@angular/animations": "^7.2.11",
    "@angular/cdk": "^7.3.6",
    "@angular/common": "^7.2.11",
    "@angular/compiler": "^7.2.11",
    "@angular/core": "^7.2.11",
    "@angular/forms": "^7.2.11",
    "@angular/http": "^7.2.11",
    "@angular/platform-browser": "^7.2.11",
    "@angular/platform-browser-dynamic": "^7.2.11",
    "@angular/router": "^7.2.11",
    "@nebular/bootstrap": "3.4.2",
    "@nebular/security": "3.4.2",
    "@nebular/theme": "3.4.2",
    "@ng-bootstrap/ng-bootstrap": "^4.0.0",

[shanshel]

same issue here

[johnsnow20087349]

same issue

[johnsnow20087349]

I found that the two date elements I used were using the same template reference variable name, I fixed it by using different names

[ArtemRomanovsky]

hi @ik1728! Please, update your Nebular version. The issue was resolved recently (https://github.com/akveo/nebular/pull/2011). Closing as fixed

[thebeard]

Same issue, even after updating to 4.5.0

[yggg]

@thebeard Could you please provide error log?

[thebeard]

@yggg Apologies for the time passed since your request.

When I set my production configuration to { optimization: true }, I get the following error in my devTools console when navigating to the route:

main-es2015.01389b2fa83c7f0a5ea1.js:1 ERROR TypeError: Cannot read property 'trigger' of undefined
    at sd.createTriggerStrategy (main-es2015.01389b2fa83c7f0a5ea1.js:1)
    at sd.subscribeOnTriggers (main-es2015.01389b2fa83c7f0a5ea1.js:1)
    at sd.attach (main-es2015.01389b2fa83c7f0a5ea1.js:1)
    at Bu.setupPicker (main-es2015.01389b2fa83c7f0a5ea1.js:1)
    at Bu.set setPicker [as setPicker] (main-es2015.01389b2fa83c7f0a5ea1.js:1)
    at Kp (main-es2015.01389b2fa83c7f0a5ea1.js:1)
    at main-es2015.01389b2fa83c7f0a5ea1.js:1
    at main-es2015.01389b2fa83c7f0a5ea1.js:1
    at ty (main-es2015.01389b2fa83c7f0a5ea1.js:1)
    at ky (main-es2015.01389b2fa83c7f0a5ea1.js:1)

[xxShefiroxx]

Hi Team The same issue

ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'destroy' of undefined TypeError: Cannot read property 'destroy' of undefined at NbDatepickerComponent.ngOnDestroy (index.js:20911) at callProviderLifecycles (core.js:24913) at callElementProvidersLifecycles (core.js:24872) at callLifecycleHooksChildrenFirst (core.js:24854) at destroyView (core.js:35282) at callViewAction (core.js:35441) at execComponentViewsAction (core.js:35349) at destroyView (core.js:35281) at callWithDebugContext (core.js:36395) at Object.debugDestroyView [as destroyView] (core.js:35992) at resolvePromise (zone-evergreen.js:797) at resolvePromise (zone-evergreen.js:754) at zone-evergreen.js:858 at ZoneDelegate.invokeTask (zone-evergreen.js:391) at Object.onInvokeTask (core.js:30873) at ZoneDelegate.invokeTask (zone-evergreen.js:390) at Zone.runTask (zone-evergreen.js:168) at drainMicroTaskQueue (zone-evergreen.js:559) at ZoneTask.invokeTask [as invoke] (zone-evergreen.js:469) at invokeTask (zone-evergreen.js:1603)

{ "name": "ngx-admin", "version": "4.0.1",

[cyberbobjr]

same issue here :( :( :( really annoying this date picker component

[markpenaranda]

Does anyone found solution to this problem?