CODEWITHSUNDEEP
angularionic2
Tomas Marik
Tomas Marik

Reputation: 4093

Ionic 2: navigate using URLs

I am very new in Ionic 2 framework. I would like to know, how can I navigate in ionic app using urls. Similar way as navigation is done in Angular 2 application.

Let's say I want to have IntroPage on localhost:8100/intro with login button and after pressing the button I want to be redirect to HomePage on localhost:8100/home. 

localhost:8100/intro -> localhost:8100/home

Upvotes: 2

Views: 2002

Answers (2)

Mavlarn
Mavlarn

Reputation: 3883

You can use DeepLinker of ionic2.

In ionic2, you can navigate just with this.navigator.push(SomeComponent). But if you want the url change, you need define deeplinker for them like:

imports: [
 IonicModule.forRoot(MyApp, {}, {
  links: [
   { component: HomePage, name: 'Home', segment: 'home' }
  ]
 })
]

Upvotes: 2

federico scamuzzi
federico scamuzzi

Reputation: 3778

as documentation says : (https://ionicframework.com/docs/v2/api/navigation/NavController/) you cannot still use ui-sref like in ionic 1..but only this.navigation.push('home')... it means you have to do a function on a html (maybe a (click)="myfunc()" ) to call the navigation in ts file

import { Component, ViewChild } from '@angular/core';
import { NavController } from 'ionic-angular';

@Component({
   template: '<ion-nav #myNav [root]="rootPage"></ion-nav>'
})
export class MyApp {
   @ViewChild('myNav') nav: NavController
   public rootPage = TabsPage;

   // Wait for the components in MyApp's template to be initialized
   // In this case, we are waiting for the Nav with reference variable of "#myNav"
   ngOnInit() {
      // Let's navigate from TabsPage to Page1
      this.nav.push('home');
   }
}

Upvotes: 0

Related Questions