Get current page/ view name in RC0 returns "t"


#1

I wish to handle the hardware back button for that i need to get the name of the current view.
I am using the tabs template and trying to get the current tab name doing the following

       console.log(this.nav.getActive());
       console.log(this.navCtrl.getActive().component.name);

This just returns the letter t on the device but does work in the browser.

Kindly let me know as to how can I get the page/tab/view name on the device for handling back button


#2

please let me know if you find an answer. Can’t figure it out either. Thanks.


How to get current page name?
#3

Not a solution, just a remark. I “often” see posts on the forum referencing the error “returns t” and also often see that the solutions were somewhere in missing injections or that errors were still displayed during the build process…if that could help

@almighty99 about handling the back button, here’s what I do:

private overrideHardwareBackAction() {
    this.platform.ready().then(() => {
        this.unregisterCustomBackActionFunction = this.platform.registerBackButtonAction(() => {
            let activeView: ViewController = this.navController.getActive();

            if (activeView != null && ((<any> activeView).instance instanceof MyPage)) {
                this.myCustomBackAction();
            } else {
                this.navController.pop();
            }
        });
    });
}

#4

@reedrichards Thanks for the reply. I did double check. No error during the build process and the strange thing is that getting the active component works perfectly in the browser. And it works in the device to but returns t in place of the component name


#5

I don’t think it is a good idea to rely on class names in JavaScript, ever. What is probably happening is that a minifier/uglifier is changing the names out from under you.


#6

@rapropos actually the sample of code I wrote down here wrote here work fine in my project.

Coming from java it sounded like a ok way to check the active view. In such a case, may I ask you, what you will then recommend?


#7

You’re not relying on class names, you’re using instanceof, which will work properly when minified. That should be fine.


#8

@reedrichards @rapropos
Yes the t is a result of the minification hence it only shows up when built for device.

Can you guys clarify one thing here.

  1. Where to register backbutton handler so that it will effect the entire app? I am using the Tabs template and I tried registering it in the tabs.ts file but it didn’t work, as there was no instance of the “view” yet.

2)In the following code

 this.navController.getActive().instance instanceof MyPage;

What is MyPage here?


#9
  1. I do the register in a view accessed from a tab. It only affect that view because I call in ionViewWillLeave the function this.unregisterCustomBackActionFunction

  2. In that case, MyPage is the active view, the view where I want to have a special back action (I built a wizard in that page, that’s why on back I’ve to go to the previous step of the wizard till I reach the first)


#10

Figured out how to get the name of the page. This will get the title of the page.
So whatever you have in tag will show up, even the spaces and line retuns

  console.log(this.viewCtrl.instance.navCtrl._app._title);

Had to do some deep digging for this.

Surely there is an easier way.

Anyone coming to this later on, Please do post better way of getting page/view name for navigation purposes.


Is ViewController.name deprecated in Ionic 2?
Ionic - Global navigation change event
#11

The bad thing, IMO, about using instance-property is that it is ViewController’s private property. So there might be a risk of it disappearing/being renamed without a notice (apart from a line in release notes).

Nevertheless, I was bitten by this t-name thingy as well, and I am now refactoring my code base to use this.navCtrl.getActive().instance instanceof -style.


#12

That means its a promise, use then function to show value.


#13

That’s a good point. I think in most situations there should be a way to write things that bypasses this issue entirely, such as registering custom listeners only when a particular page is active (set up in ionViewWillEnter and tear down in ionViewWillLeave).


#14

Try using $ionicHistory will help ;

sample:

var currentState = $ionicHistory.currentStateName();
console.log("I’m in foreground: currentState: " + currentState);

This will result the name of the state you’ve set in route.js so will help you know your on which page.