'ERROR TypeError: Cannot read property 'setScreenName' of undefined' after upgrading to Angular 6.1.0

[VladimirAmiorkov]

Hi,

After upgrading a project to the latest NativeScript 4.2.2 and Angular 6.1.0. I am seeing this error on Android once I use the logView() method. Here is the full package.json of dependencies:

"dependencies": {
    "@angular/common": "~6.1.0",
    "@angular/compiler": "~6.1.0",
    "@angular/core": "~6.1.0",
    "@angular/forms": "~6.1.0",
    "@angular/http": "~6.1.0",
    "@angular/platform-browser": "~6.1.0",
    "@angular/platform-browser-dynamic": "~6.1.0",
    "@angular/router": "~6.1.0",
    "@ngrx/store": "4.1.1",
    "nativescript-angular": "^6.0.0",
    "nativescript-camera": "4.0.2",
    "nativescript-floatingactionbutton": "4.1.3",
    "nativescript-fresco": "4.0.0",
    "nativescript-google-analytics": "0.4.4",
    "nativescript-image-swipe": "3.0.0",
    "nativescript-imagepicker": "6.0.3",
    "nativescript-iqkeyboardmanager": "1.1.0",
    "nativescript-orientation": "^2.2.0",
    "nativescript-ui-listview": "^3.5.11",
    "nativescript-ui-sidedrawer": "^4.3.0",
    "reflect-metadata": "0.1.10",
    "rxjs": "~6.1.0",
    "rxjs-compat": "^6.2.2",
    "tns-core-modules": "^4.2.0",
    "zone.js": "^0.8.26"
  },
  "devDependencies": {
    "@angular/compiler-cli": "~6.1.0",
    "@ngtools/webpack": "~6.1.0",
    "nativescript-dev-typescript": "~0.7.2",
    "nativescript-dev-webpack": "^0.15.1",
    "tns-platform-declarations": "4.2.0",
    "typescript": "~2.8.2"
  },

Error

Refreshing application...
Successfully synced application com.cobbl.app on device 01a5bd7074a39516.
JS: Angular is running in the development mode. Call enableProdMode() to enable the production mode.
JS: ERROR TypeError: Cannot read property 'setScreenName' of undefined
JS: ERROR CONTEXT {
JS:   "view": {
JS:     "def": {
JS:       "nodeFlags": 37994497,
JS:       "rootNodeFlags": 33554433,
JS:       "nodeMatchedQueries": 0,
JS:       "flags": 0,
JS:       "nodes": [
JS:         {
JS:           "nodeIndex": 0,
JS:           "parent": null,
JS:           "renderParent": null,
JS:           "bindingIndex": 0,
JS:           "outputIndex": 0,
JS:           "checkIndex": 0,
JS:           "flags": 33554433,
JS:           "childFlags": 4440064,
JS:           "directChildFlags": 4440064,
JS:           "childMatchedQueries": 0,
JS:           "matchedQueries": {},
JS:           "matchedQueryIds": 0,
JS:           "references": {},
JS:           "ngContentIndex": null,
JS:           "childCount": 1,
JS:           "bindings": [],
JS:           "bindingFlags": 0,
JS:           "outputs": [],
JS:           "element": {
JS:             "ns": "",
JS:             "name": "ng-component",
JS:             "attrs": [],
JS:             "template": null,
JS:             "componentProvider": {
JS:               "nodeIndex": 1,
JS:               "parent": "[Circular]",
JS:               "renderParent": "[Circular]",
JS:               "bindingIn...
JS: To enable debug logging use: adb shell setprop log.tag.GAv4 DEBUG

The issue seams to be caused by an change in the way the ngOnInit is being resolved in the newest version of Angular. What happens is that the call of the ngOnInit is called before the launchEvent lifecycle event is raised in which I am calling the initalize(). The callbacks in latest versions of Angular is:

• the bootstrapped component's ngOnInit
• after that the launchEvent of the application lifecycle

And it used to be:

• the launchEvent of the application lifecycle
• after that the bootstrapped component's ngOnInit

[mm-spiio]

Is there any solution to this? This is an issue only on android for me but its ok in ios.