Angular routing vs Ionic routing

Question

I'm new to ionic2. There is something weird in it's routing compared to pure angular routing. In Angular:

const appRoutes: Routes = [
  { path: 'crisis-center', component: CrisisListComponent },
  { path: 'hero/:id',      component: HeroDetailComponent },
  {
    path: 'heroes',
    component: HeroListComponent,
    data: { title: 'Heroes List' }
  },
  { path: '',
    redirectTo: '/heroes',
    pathMatch: 'full'
  },
  { path: '**', component: PageNotFoundComponent }
];

@NgModule({
imports: [
  RouterModule.forRoot(appRoutes)
  // other imports here
],

We pass a constant with type of Routes.

In Ionic (sidemenu starter) they pass a component to forRoot function.

import { MyApp } from './app.component';
imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp),
],

Any idea?

ionicframework.com/docs/api/navigation/NavController

Suraj Rao
– Suraj Rao

2017-05-19 05:33:13 +00:00
Commented May 19, 2017 at 5:33 — Suraj Rao
– Suraj Rao, Commented May 19, 2017 at 5:33
Things have changed ionicframework.com/blog/…

Akhil Kooliyatt
– Akhil Kooliyatt

2020-11-04 10:26:30 +00:00
Commented Nov 4, 2020 at 10:26 — Akhil Kooliyatt
– Akhil Kooliyatt, Commented Nov 4, 2020 at 10:26

Akhil Kooliyatt · Accepted Answer · 2020-11-09 15:21:36Z

13

Edit:

Ionic 4 is also using standard angular routes in the background.Pushing and popping is not the ionic way anymore and here is a good read on using angular router with ionic.

Original Answer:

Ionic does not support URL routes, instead it implements a custom navigation solution - NavController (as linked by suraj). NavController maintains a stack of pages - moving forward you push a page to the stack this.nav.push(Page1); and moving back you pop it this.navCtrl.pop();. In this way your url in browser is always the same and application always opens on the home page - which is similar to mobile application behaviour. To enable direct access to a certain resource (as you would open url myapp/items/1) you have to use deep linking plugin.

edited Nov 9, 2020 at 15:21

Akhil Kooliyatt

9354 gold badges17 silver badges38 bronze badges

answered Jul 24, 2017 at 13:23

Gregor Srdic

4467 silver badges10 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

The Outstanding Question Asker Over a year ago

Which ionic version are you talking about? It is perfectly fine in the new Ionic (4+).

Chirag thaker · Accepted Answer · 2019-09-10 14:17:17Z

1

In ionic, we push a view screen from another views

But in angular it is predefined routes mapping that if you go to this route i.e. app/login you will be redirected to login route that is bind with loginComponent

answered Sep 10, 2019 at 14:17

Chirag thaker

3312 gold badges5 silver badges15 bronze badges

Collectives™ on Stack Overflow

Angular routing vs Ionic routing

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related