How to configure deeplinks in AppModule.forRoot()?

export const deepLinkConfig: DeepLinkConfig = {
    links: [
        {segment: 'dashboard', component: DashboardPage, name: 'Dash'},
        {segment: 'assignment', component: TeacherAssignmentPage, name: 'Assignment', defaultHistory: [DashboardPage]},
        {segment: 'guide', component: GuideContentPage, name: 'Guide', defaultHistory: [DashboardPage]},
    ]
};

        IonicModule.forRoot(NoctiApp, {}, deepLinkConfig),

I’ve also added the following, in some tries with the path method:

     ngAfterViewInit() {
        this.platform.ready().then(() => {
            Deeplinks.routeWithNavController(this.nav, {
                '/admin/dashboard': DashboardPage,
                '/admin/assignment': TeacherAssignmentPage
            }).subscribe((match) => {
                // match.$route - the route we matched, which is the matched entry from the arguments to route()
                // match.$args - the args passed in the link
                // match.$link - the full link data
                console.log('Successfully matched route', match);
            }, (nomatch) => {
                // nomatch.$link - the full link data
                console.error('Got a deeplink that didn\'t match', nomatch);
            });
        });
    }

Here’s what I get with the hash method, currently:

image

One thing I’ve mentioned elsewhere, but forgot to here, is that I haven’t installed the deeplinks plugin. I’m not sure if it is needed for just a web app, and also I wasn’t sure how to have it handle a different server name for production and development, since it seems hard-coded on the command line.

I’ve never used Deeplinks.routeWithNavController. Its not needed. Deeplinks is built into ionic. if you comment that code out and use

ngAfterViewInit() {
this.nav.setRoot(this.nav._linker.segments[0].name).catch(err =>{
this.nav.setRoot(DashboardPage);
});
}

let me know if that works.

Just a note the catch is incase the ionCanViewEnter returns false on the component you want to go to.

Thanks, Alex. I only used that when trying it with the path strategy, which FdezRomero says isn’t ready yet. I wasn’t using it with the hash strategy. When I added your lines I get this:

Also, the segments array is zero length.

What Ionic version are you on?

I’m using the RC2 version. Pretty sure it is the latest.

Jeez, I guess this means I have RC1! I just don’t get how to upgrade, I guess. I started with a clean slate, clean install a few weeks ago, thinking I was getting RC2.

Daves-Macbook:frontend dqj$ ionic info


Your system information:

Cordova CLI: 6.4.0
Gulp version: CLI version 3.9.1
Gulp local: Local version 3.9.1
Ionic Framework Version: 2.0.0-rc.1
Ionic CLI Version: 2.1.4
Ionic App Lib Version: 2.1.2
Ionic App Scripts Version: 0.0.36
ios-deploy version: 1.9.0
ios-sim version: 5.0.9
OS: Mac OS X Sierra
Node Version: v6.8.1
Xcode version: Xcode 8.1 Build version 8B62


Daves-Macbook:frontend dqj$

Ok I’m on rc3 with this working. I’m not able to go back and verify on older versions.

Thanks. I’ll try and figure out how to get to RC3. Any leads on how to do that?

From rc1 I think it was pretty painless. I just updated package.json. Dont remember any real issues.

I wish that were true for me. Upgrades never seem to work, and I don’t know why. I try to use everything standard, and follow all instructions. I get hundreds of messages, after changing to rc3 in the package.json file and running npm install.

Is there some other command to run, other than npm install?

[12:55:43] typescript: node_modules/@types/core-js/index.d.ts, line: 21
Duplicate identifier ‘PropertyKey’.

  L20:  * target object. Returns the target object.
  L21:  * @param target The target object to copy to.
  L22:  * @param source1 The first source object from which to copy properties.

[12:55:43] typescript: node_modules/@types/core-js/index.d.ts, line: 85
All declarations of ‘name’ must have identical modifiers.

  L84:    * otherwise.
  L85:    * @param predicate find calls predicate once for each element of the array, in asc
  L86:    * order, until it finds one where predicate returns true. If such an element is f

[12:55:43] typescript: node_modules/@types/core-js/index.d.ts, line: 145
Subsequent variable declarations must have the same type. Variable '[Symbol.unscopables]'
must be of type ‘{ copyWithin: boolean; entries: boolean; fill: boolean; find: boolean; findIndex:
boolean; keys: …’, but here has type ‘any’.

 L145:  /**
 L146:    * Creates an array from an array-like object.

Have you updated the dependencies to this? https://github.com/driftyco/ionic/blob/master/CHANGELOG.md#200-rc3-2016-11-17

Thanks so much for your time, Alex! I can’t tell you how much it is appreciated. I am much closer, but I have no idea where an indexOf might be incorrect, whether in my code or some library.

ionic-hello-world@ watch /Users/dqj/Local/dev/apps/pl3/nocti/frontend
ionic-app-scripts watch

[13:05:11] ionic-app-scripts 0.0.45
[13:05:11] watch started …
[13:05:11] build dev started …
[13:05:11] clean started …
[13:05:11] clean finished in 3 ms
[13:05:11] copy started …
[13:05:11] transpile started …
[13:05:16] build dev failed: Cannot read property ‘indexOf’ of undefined
[13:05:16] copy: Error copying “/Users/dqj/Local/dev/apps/pl3/nocti/frontend/src/manifest.json” to
“/Users/dqj/Local/dev/apps/pl3/nocti/frontend/www/manifest.json”: File not found
[13:05:16] copy finished in 5.13 s
[13:05:16] watch ready in 5.17 s
Running live reload server: http://localhost:35729
Watching: www//*, !www/lib//, !www/**/.map
√ Running dev server: http://localhost:8100
Ionic server commands, enter:
restart or r to restart the client app from the root
goto or g and a url to have the app navigate to the given url
consolelogs or c to enable/disable console log output
serverlogs or s to enable/disable server log output
quit or q to shutdown the server and exit

ionic $

is it this error? RC1 - Manifest.JSON error

Yes, that was one of the problems. I am very grateful for your help in upgrading to RC3! If you’re ever interested in dev support consulting, please let me know by private message!

Unfortunately, the original issue is still a problem. If I enter the hash url portion manually, nothing happens and I get a “nav-util.js:33 invalid page component: null” error in the console.

tl;dr
After much gnashing of teeth I was able to get there. I had to remove the typings and node_modules directories, re-run nmp install and then re-install my custom modules (ng2-chartjs and ng2-select2) to get it back up and running.

Edit: removed the font copying issue. I had my own directory named fonts in assets, and the new release wanted to use that name.

can you update your segments in deepLinkConfig to be /admin/dashboard and not just dashboard? It needs the full path to route.

I tried a number of variations, including #/admin/dashboard, dashboard, admin/dashboard and /dashboard. They all show different things in the URL, but typing them in manually still doesn’t work.

Here’s how it shows for /admin/dashboard:

Whats /admin? where does that come from?

That’s from the tabs template. I added the tabUrlPath to see if it would help things:

<ion-tabs id="mainTabs" [selectedIndex]="selectedIndex">
    <ion-tab *ngFor="let p of pages; let i=index"
             [root]="p.page"
             [rootParams]="mergeParams(p.args)"
             [tabTitle]="p.title"
             [tabIcon]="p.icon|icon"
             (ionSelect)="tabSelected(i,p,mergeParams(p.args))"
             [tabUrlPath]="'admin'"
    >
    </ion-tab>
</ion-tabs>

Leaving tabUrlPath out I get http://admin.nocti.dev/#/roster-setup/assignment and http://admin.nocti.dev/#/dashboard/dashboard for my location bar paths.