ionic-framework: Ionic 2 RC0 up : Cant get active component name and overriding back button breaks popover navigation

Short description of the problem:

Overriding back button functionality. can’t get active components name since ionic rc0 update . Component name is required to decide on which page to go.

I have mentioned specific use case for my app [https://forum.ionicframework.com/t/how-to-get-current-active-component-in-rc0/67468](here https://forum.ionicframework.com/t/how-to-get-current-active-component-in-rc0/67468)

Till beta , getting component ame was possible. In RC0 , it always returns 't' due to minification.

As bengtler suggested , I tried this : (which is enough for my use case)

let firstView : any;
firstView = this.nav.first();
if(this.nav.isActive(firstView)){
     console.log('first tab active');
  }else{
      console.log('Go to first tab');
}

But , above does not work. It always logs 'first tab active'

Overriding back button also breaks popover navigation. if popover is open , and user hits back then popover won’t close instead it will navigate and popover still remains open.

What behavior are you expecting?

A method which would return just a active component name (even after minification) and specifying whether any overlay element like popover is active on that component.

This will make a lot of things easy.

Steps to reproduce:

start a RC0 app.
Override back button , and get active viewcontroller.
Run on device

Theres no way to know what component is active from returned viewcontroller result.

Run ionic info from terminal/cmd prompt: (paste output below)

Cordova CLI: 6.3.1
Gulp version:  CLI version 3.9.1
Gulp local:
Ionic Framework Version: 2.0.0-rc.1
Ionic CLI Version: 2.1.0
Ionic App Lib Version: 2.1.0-beta.1
OS:
Node Version: v4.1.0

About this issue

Original URL
State: closed
Created 8 years ago
Reactions: 3
Comments: 19 (2 by maintainers)

Most upvoted comments

In the meantime I found a workaround (for an app which is wired using lazy loading). It works just fine also for builds made using the --prod flag.

openPage(page) {
  if (this.isPageAlreadyActive(page)) {
    return;
  }
  this.nav.setRoot(page.component);
}

private isPageAlreadyActive(page): boolean {
  return this.nav.getActive().pageRef().nativeElement.tagName === `PAGE-${page.component.toUpperCase()}`;
}

Hoping Ionic folks will show some love for this bug as I believe there are and will be many wondering why a page is reloaded if you tap on the same (its own) navigation icon/menu item.

+13

zarko-tg on May 6, 2017

I’m handling that like that.

Every page contain public static readonly pageName = 'MyBestPage';
Than it’s easy to check this.nav.getActive().component.pageName === 'MyBestPage';

I think that way is more clear.

troyanskiy on Sep 25, 2017

derasmus on May 5, 2017

Hi I know is late but could be useful for someone let activeView = this.navCtrl.getActive(); if (activeView.component == ConversationPage) { }

ruben0909 on Feb 13, 2017

+1 . My view name is always “e”.

omgalbert on Apr 4, 2017