While developing a new (tabs based) ionic app, i tried to push a new page. I already tried this.navCtrl.navigateForward(MyComponent) and this.router.navigate(['tabs','my','component']). I injected the Router (or NavCtrl) in the constructor and made it private.
@Component({
selector: 'app-stream',
templateUrl: './stream.page.html',
styleUrls: ['./stream.page.scss'],
})
export class Component {
constructor(
private router: Router,
private navCtrl: NavController,
) {
}
public navigateRouter() {
this.router.navigate(['some', 'url'])
}
public navigateNav() {
this.navCtrl.navigateForward(OtherComponent)
}
}
In both cases, the URL gets updated, but the page component wont be displayed.
This is an example, the real app could be found on github (currently in the feature/stream branch)
Git (Fixed commit)
I’m actually not so sure about my routing (anymore).
My goal is to have /tabs removed in the URL and have routes like:
/stream
/stream/locations/:locationId
/tab2
/tab3
src/app/app-routing.module.ts
src/app/tabs/tabs.router.module.ts
src/app/tabs/stream/stream.module.ts
Any help is appreciated.
PS: i also tried the directive routerLink="MyComponent" in combination with routerDirection="forward"