Nav.push does nothing, but app hangs

In my Ionic2 app I have some buttons which need to navigate the user to another page. While most of them work fine, there are also some who don’t.

The code is as simple as possible and is used in a popover:

gotoPage() {
    this.nav.push(MyPage, {
        data: this.userData
    }).then(() => this.viewCtrl.dismiss());

When I click the button no error message nor page transition is shown. It looks like app crashed. I can click the outside of the popover but the app doesn’t response anymore.

I tried to create a Plunkr which looks my situation: However here the error doesn’t happen.

Any thoughts how I can debug this? It looks like something goed wrong but no error is fired.

When I put a breakpoint on the constructor of MyPage it is never triggered.

I’ve experienced such behaviour only if the page that should be pushed has some errors, like wrong tag. Have you tried to remove the code from pushed page, just to check if transition happening?

I’ve tried to replace the MyPage code with:

import {IONIC_DIRECTIVES} from 'ionic-angular';
import {Component} from '@angular/core';

    directives: [IONIC_DIRECTIVES],
    template: `<ion-navbar *navbar>


export class MyPage {}

Which unfortunately gave the same behaviour.

Is there a reason why you use template instead of generated HTML file? And I’m not sure about ` sign. Are you sure it is the same as '?

It works the same, but ’ is definitely not the same as in Typescript. With the you can put multiline strings in a variable without the old school string concatenation:

template: '<ion-navbar *navbar>' +
'<ion-title>Test</ion-title>' +


You can read more info @

Small follow up: When I rename the files of the component it works. When I make changes I need to rename and recompile again. Atom says the file is not in the Typescript context. While these clearly are. Weird stuff…