Using URL's to navigate in Ionic 2

Angular has refactored their router multiple times, and it is not currently supported in the latest version of Ionic. We added the following section to our changelog with the beta.7 release:

The Angular router is currently under heavy development and refactoring. As a result of this, Angular’s router is currently disabled within Ionic. If your app requires use of the router we recommend waiting until a future release of Ionic when Angular has completed work on the new router. However, this does not affect Ionic’s navigation system and it continues to work with the same API from previous versions.

We understand and agree that routing is important, and we will add support for it when Angular has released a stable version. Thank you and sorry!

1 Like

It means right now there is no way to share a link for a particular page? Also I’d like to see URL accept parameter as well like http://a.com/pagename&id=10

2 Likes

Do you know an estimate on when it is going to be done?

A stable angular version with the component router has released. When do you plan to integrate it?

2 Likes

I would also love to know what the options / plans are for this. Don’t want to delve deep into the Angular Router if this will become a feature, before getting too far into my current app. URL navigation will be critical for it.

Actually just found this:

Great if you are working on a PWA like me! And it sounds like it will be in the docs soon.

2 Likes

Does the latest build support url routing ? It’s really painful to go back to the home page in the live reload every time my code changes…

2 Likes

Oh, just noticed there is a deep linker to use here:

Thanks

It seems straightforward but I got “invalid page component: Null” with below. Idea?

http://localhost:8100/#/housedetail/1111

export const deepLinkConfig: DeepLinkConfig = {
links: [
{ component: TabsPage, name: ‘home’, segment: ‘home’ },
{ component: HouseDetailPage, name: ‘detail’, segment: ‘housedetail/:id/:list’, defaultHistory: [ TabsPage ] }
]
};

imports: [
IonicModule.forRoot(MapleApp, {

},deepLinkConfig),
CloudModule.forRoot(cloudSettings),

],

2 Likes

Any update on this please?How to do url based navigation?

2 Likes

I am also looking for some examples on using URL based navigation for ionic 2. Any chance you can update the conference app to include this?

1 Like

@adrianteh Have you please managed to get deep linking working with push notifications? Thanks!

Can you please provide code sample for Ionic 2 App that works as PWA and show url also?I tried creating but url does not get changed.

Thanks in advance.

1 Like

Any update on this i have tried deep link but don’t think this is what i am looking for as this seems to be more focused on linking to parts of your app from external websites.

As long as you use the hash strategy this should allow navigation from a url at app start. If you do not use the hash strategy you will need a custom server to handle url redirection.

ngAfterViewInit() {
this.login.getUser().then(user => {
this.nav.setRoot(this.nav._linker.segments[0].name).catch(err =>{
this.nav.setRoot(HomePageComponent);
});
}).catch(err => {
this.nav.setRoot(HomePageComponent);
});
}

Hi, any update about it? thanks

any update? I’m building a PWA that must support pathlocation and not hashlocation.
Also, the ionic serve is displaying Cannot get /list with deeplink enabled.

HI! with the new post about using Ionic as Desktop the need for url parsing is a really important thing.
Do you have any example of to accomplish that?
Thanks!

1 Like

Does anyone knows if it is possible to use secondary routes with Deeplink? I created another topic that explains the challenge and would appreciate any help:

Any updates? Without secondary routes nothing to talk about scalable complex applications IMO.