Giters

ngParty / ng-metadata

Angular 2 decorators and utils for Angular 1.x

Home Page:https://hotell.gitbooks.io/ng-metadata/content/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Destroy called twice on downgraded component

aciccarello opened this issue · comments

commented

Note: I've solved my problem but I am opening this issue in hopes that it can save someone else several hours of debugging. It may point to a larger issue with the NgModule implementation that should be addressed.

Error

I'm ran into an issue where my downgraded component was being destroyed twice. This caused Angular (when in debug mode) to try to find a debug node that has already been deleted.

angular.js:14700 TypeError: Cannot read property 'nativeNode' of null
at removeDebugNodeFromIndex (core.es5.js:6480)
at DebugRenderer2.webpackJsonp.../../../core/@angular/core.es5.js.DebugRenderer2.destroyNode (core.es5.js:13556)
at destroyViewNodes (core.es5.js:12518)
at destroyView (core.es5.js:12502)
at callWithDebugContext (core.es5.js:13475)
at Object.debugDestroyView [as destroyView] (core.es5.js:13029)
at ViewRef_.webpackJsonp.../../../core/@angular/core.es5.js.ViewRef_.destroy (core.es5.js:10214)
at ComponentRef_.webpackJsonp.../../../core/@angular/core.es5.js.ComponentRef_.destroy (core.es5.js:9944)
at HTMLElement. (static.es5.js:335)
at defaultHandlerWrapper (angular.js:3771)

The destroying is being triggered by a ui-view change. The error stops the transition and the whole app became unusable.

What was odd was that it only seemed to happen when I used provideNg2Component with an NgModule from ng-metadata. When using downgradeNg2Component or just used the Angular downgradeComponent function with a normal AngularJS module, the error went away. When I debugged the bundle function I realized that the _bundleComponent method was being called multiple times. I'm wondering if this registered multiple $destroy handlers.

Workaround

The reason that the component was being bundled multiple times was because it was in a module that was imported several times. So when module0 below is bundled, the components of featureMod1 are bundled three times.

/module0
  /featureMod1
  /featureMod2 (depends on featureMod1)
  /featureMod3 (depends on featureMod1)

To avoid this issue, I changed my module structure to have a separate module for components that are downgraded that is only bundled once.

commented

I think the new Angular DI system does not want modules to be imported multiple times so I'll close this issue.