Ionic-framework: bug: [4.3.0] this.router.getCurrentNavigation is not a function

[goelectricstations]

ionic (Ionic CLI) : 4.12.0 (C:\Users\Computer\AppData\Roaming\npm\node_modules\ionic)
Ionic Framework : @ionic/angular 4.3.0-dev.201904171418.07e739a
@angular-devkit/build-angular : 0.7.5
@angular-devkit/schematics : 0.7.5
@angular/cli : 6.1.5
@ionic/angular-toolkit : not installed

Cordova:

cordova (Cordova CLI) : 8.1.2 ([email protected])
Cordova Platforms : not available
Cordova Plugins : not available

System:

Android SDK Tools : 26.1.1 (C:\Program Files (x86)\Android\android-studio\sdk)
NodeJS : v11.9.0 (C:\Program Files\nodejs\node.exe)
npm : 6.9.0
OS : Windows 10

[mrhyper]

I had same situation after update. I noticed that my App is working on @ionic/[email protected], error occurs after update to 4.1.3 and higher.

[goelectricstations]

@mrhyper how did you fix?
I cannot figure out how to fix.

[mrhyper]

I installed older version of @ionic/angular - it works for me, I can keep working while they fix this.
npm install @ionic/[email protected]

So command by command it was something like

npm install -g ionic cordova
npm audit fix
npm install @ionic/[email protected]

.. but I do have all other modules updated and I did npm audit fix ...
my ionic infoshows:

Ionic:

ionic (Ionic CLI) : 4.12.0 (C:\Users\Hypermotion\AppData\Roaming\npm\node_modules\ionic)
Ionic Framework : @ionic/angular 4.1.2
@angular-devkit/build-angular : 0.13.8
@angular-devkit/schematics : 7.1.4
@angular/cli : 7.3.8
@ionic/angular-toolkit : 1.2.2

System:

NodeJS : v10.15.0 (C:\Program Files (x86)\nodejs\node.exe)
npm : 6.4.1
OS : Windows 10

When I install newer version of @ionic/angular the bug comes back in.
In changelog you can see they did some changes to routing .. I suppose it's somewhere ther
https://github.com/ionic-team/ionic/releases

.. but I'll get back to it later .. I hope it'll be fixed and now I can keep writing.

[goelectricstations]

@mrhyper OK get the work around I do not understand why they did not fix with the last udpated.

[mrhyper]

Ok, I've managed to make everything work with the latest updates.
I suppose that updating Angular through it's own tool solved my problem.

ng update @angular/cli
ng update
ng update @angular/core

And then I forced npm to find all latest packages and ignore specific versions I had in my package.json (before that I didn't notice there were few packages that didn't update).

npm i -g npm-check-updates
ncu -u
npm install

And in the end a bit scary: npm audit fix
Now this.router.getCurrentNavigation is not a function error with @ionic/[email protected] is gone.

My ionic info

Ionic:

   ionic (Ionic CLI)             : 4.12.0 (C:\Users\Hypermotion\AppData\Roaming\npm\node_modules\ionic)
   Ionic Framework               : @ionic/angular 4.3.0
   @angular-devkit/build-angular : 0.13.8
   @angular-devkit/schematics    : 7.3.8
   @angular/cli                  : 7.3.8
   @ionic/angular-toolkit        : 1.2.2

Cordova:

   cordova (Cordova CLI) : not installed
   Cordova Platforms     : none
   Cordova Plugins       : no whitelisted plugins (1 plugins total)

System:

   NodeJS : v10.15.0 (C:\Program Files (x86)\nodejs\node.exe)
   npm    : 6.4.1
   OS     : Windows 10

[liamdebeasi]

Hi there,

A call to getCurrentNavigation was added in Ionic 4.2.0. @goelectricstations are you able to confirm whether or not updating Angular's tooling resolved the issue? If not, can you provide a code reproduction of this issue?

Thanks!

[brunoJSX]

I had the same problem. Then I tried the @mrhyper solution but it did not work correctly.

[liamdebeasi]

Hi @TryckBR,

Which version of Angular are you using?

[brunoJSX]

After the changes:
https://imgur.com/a/9kdCWEv

[liamdebeasi]

Hi there,

Sorry for not being clearer, but I was referring to your package.json file. The method in question seems to be a newer method that was added in Angular 7.2.0.

Thanks!

[brunoJSX]

Because it did not work I went back as I was. So my package.json looks like this:

{
"name": "central-placas",
"version": "0.0.1",
"author": "Grandal Sistemas",
"homepage": "http://ionicframework.com/",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"fcm": "concat www/ngsw-worker.js fcm.js -o www/combined-worker.js"
},
"private": true,
"dependencies": {
"@angular/animations": "^7.1.2",
"@angular/common": "~6.1.1",
"@angular/core": "~6.1.1",
"@angular/fire": "^5.1.0",
"@angular/forms": "~6.1.1",
"@angular/http": "~6.1.1",
"@angular/platform-browser": "~6.1.1",
"@angular/platform-browser-dynamic": "~6.1.1",
"@angular/pwa": "^0.8.4",
"@angular/router": "~6.1.1",
"@angular/service-worker": "~6.1.1",
"@fnando/cnpj": "^0.1.1",
"@fnando/cpf": "^0.1.1",
"@google-cloud/firestore": "^0.18.0",
"@ionic/angular": "^4.1.2",
"angular2-text-mask": "^9.0.0",
"core-js": "^2.5.3",
"exif-image": "^1.0.5",
"file-saver": "^2.0.1",
"firebase": "^5.7.2",
"graceful-fs": "^4.1.15",
"idb": "^2.1.3",
"img-tools": "^1.1.1",
"jsonfile": "^5.0.0",
"load-json-file": "^5.1.0",
"moment": "^2.24.0",
"ngx-clipboard": "^11.1.9",
"ngx-mask": "^7.3.2",
"ngx-take-until-destroy": "^5.2.3",
"resize-img-full": "^1.0.4",
"rxjs": "6.2.2",
"uninstall": "0.0.0",
"zone.js": "^0.8.26"
},
"devDependencies": {
"@angular-devkit/architect": "^0.9.0-rc.3",
"@angular-devkit/build-angular": "^0.7.5",
"@angular-devkit/core": "^0.9.0-beta.3",
"@angular-devkit/schematics": "^0.7.5",
"@angular/cli": "~6.1.1",
"@angular/compiler": "^6.1.10",
"@angular/compiler-cli": "^6.1.10",
"@angular/language-service": "^6.1.10",
"@ionic/angular-toolkit": "^1.2.0",
"@ionic/lab": "1.0.21",
"@types/file-saver": "^2.0.0",
"@types/jasmine": "^2.8.12",
"@types/jasminewd2": "^2.0.6",
"@types/jsonfile": "^4.0.1",
"@types/node": "^10.11.7",
"codelyzer": "~4.5.0",
"concat": "^1.0.3",
"jasmine-core": "~2.99.1",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~3.0.0",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "~2.0.0",
"karma-jasmine": "~1.1.1",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "~5.4.0",
"ts-node": "~7.0.0",
"tslint": "~5.11.0",
"typescript": "~2.9.2"
},
"description": "An Ionic project"
}

Version 4.1.2 works for me, but 4.2.0 and 4.3.0 is not working.

I'm sorry for my English, I'm Brazilian kkk

[goelectricstations]

Hi @liamdebeasi

i never call "this.router.getCurrentNavigation" is getting call automatically during the load of homepage see below.

const routes: Routes = [
{ path: '', loadChildren: './pages/home/home.module#HomePageModule' },
{ path: 'map-charging-stations-info.html', loadChildren: './pages/info/info.module#InfoPageModule' }
];

Please let me know thanks

[liamdebeasi]

Hi everyone,

Thanks for letting us know about this issue! As it turns out getCurrentNavigation was added in Angular 7.2. (I thought it had been there since Angular 6, but I guess I was wrong 🤷‍♂️)

We will be deploying hotfixes to both Ionic 4.2.0 and Ionic 4.3.0. I will post an update here when they have been released.

Thanks!

[brunoJSX]

Thank you very much @liamdebeasi . I was expecting this a lot :)

[liamdebeasi]

Hi everyone,

I have published nightly builds for 4.2 and 4.3.

Install nightly for 4.2: npm i @ionic/[email protected]
Install nightly for 4.3: npm i @ionic/[email protected]

I've done testing on this fix, but it would be great if someone else could test with their use case as well.

Thanks!

[brunoJSX]

I'll test it now

[brunoJSX]

It worked for me. It was perfect <3. Thank you very much ^^

Note: I only tested version 4.3

[liamdebeasi]

Hi everyone,

This issue has been resolved via https://github.com/ionic-team/ionic/pull/18107 and is available now in Ionic 4.2.1 and 4.3.1.

Thanks!

[ionitron-bot[bot]]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.