CODEWITHSUNDEEP
angularionic-frameworkionic3deep-linking
RSK
RSK

Reputation: 161

Ionic 3 native deeplinking

Managed to install and setup the native deeplinking module for Ionic.

App loads up fine even in cold state, where it is fully shutdown.

However, my route doesn't take me to the correct page. It just displays the last page the app was one, or the main page if it starts the application from cold state.

app.component.ts

...
import { Deeplinks } from '@ionic-native/deeplinks';
import { Detail1Page } from '../pages/layout/app1/detail1/detail1';
...
constructor(private deeplinks: Deeplinks.........
...
this.platform.ready().then(() => {
this.splashScreen.hide();
this.deeplinks.route({
  '/item/:itemId': Detail1Page
}).subscribe((match) => {
    console.log('Successfully matched route', JSON.stringify(match));
  }, (nomatch) => {
    console.error('Got a deeplink that didn\'t match', JSON.stringify(nomatch));
  });
}
...

The console log shows:

Successfully matched route {"$args":{"itemId":"9"},"$link":{"path":"/item/9","queryString":"","fragment":"","host":"my.app.com","url":"https://my.app.com/item/9","scheme":"https"}}

app.module.ts

...
import { Deeplinks } from '@ionic-native/deeplinks';
...
providers: [
    Deeplinks,
...

detail1.ts

...
this.itemId = this.navParams.get('itemId');
...

Your help is greatly appreciated - been working on this the whole day :)

Upvotes: 7

Views: 4705

Answers (2)

DerrickF
DerrickF

Reputation: 682

I ran into that same problem just yesterday...

In my case, I didn't register my page everywhere that your supposed to in my app.module.

@NgModule({
  declarations: [
    MyPage
  ],
  imports: [
    IonicPageModule.forChild(MyPage)
  ],
  entryComponents: [
    MyPage
  ]
})
export class MyPageModule {}

For me I was missing the IonicPageModule.forChild reference. Here is the documentation page where it talks about setting a page up for deeplinking. https://ionicframework.com/docs/api/navigation/IonicPage/#usage

Upvotes: 2

Ragesh Pikalmunde
Ragesh Pikalmunde

Reputation: 1413

I know its too late but still, it can be helpful for someone. I am redirecting the user after subscribing so you can put more logic if the user is logged in on not or so you can change things accordingly

this.deeplinks.route({
  '/item/:itemId': {}
}).subscribe(match => { 
    console.log('Successfully matched route' + JSON.stringify(match));
    this.nav.push(Detail1Page, { issueId: match.$args.issueId});

  }
}, nomatch => {
  console.error('Got a deeplink that didn\'t match' + JSON.stringify(nomatch));
});

Upvotes: 2

Related Questions