CODEWITHSUNDEEP
javascriptrouteraurelia
Naadof
Naadof

Reputation: 517

Aurelia setRoot works when in homepage but not in a child page

Summary:
WORKS
1) log-in
2) see main page with test1 button and log out button
3) press log out
4) get logged out and taken to log-in page

DOESN'T WORK
1) log-in
2) see main page with test1 button and log out button
3) press test1
4) get taken to test1 page
5) press log out
ERROR [app-router] Error: Route not found: /test1

I've cut down my code to the bit I'm struggling with and made a plunker, HOWEVER plunker doesn't like the inject tag I'm using and therefore doesn't render. You can still see the code layout though (if anyone can fix the inject issue that would be awesome).
plunker: http://embed.plnkr.co/V5IoGqDfmo1djd3kW6bZ/

The idea is that the entry module has a router with only two routes - log in and password-reset (taken the password reset out of plunker as irrelevant). When the user logs in, we set the root to the app, which has another router that only someone who is logged in can access.

Once logged in, pressing the log out button will destroy the session and reset the root to entry.

However, if a user logs in, clicks on one of the modules in the app's router (e.g. test1), THEN clicks log out, we get the error: ERROR [app-router] Error: Route not found: /test1

I've tried:
1) resetting the router before setting the root (i.e. this.router.reset())
2) navigating to home before setting to root (i.e. this.router.navigate(''))
3) the answers suggested here:
Aurelia router not working when resetting root
4) the answers suggested here:
Aurelia clear route history when switching to other app using setRoot
Any suggestions would be appreciated, I'm happy to restructure the code if it fundamentally will not work.

Upvotes: 0

Views: 330

Answers (1)

Fabio
Fabio

Reputation: 11990

I'm not sure but I think this is a bug that was fixed in the past but for some reason it's back now. I'll try to investigate.

As a solution, you could use mapUnknownRoutes in both routers to redirect the user to the desired route. For example:

Login Router

configureRouter(config, router) {
      config.title = "Super Secret Project";
      config.map([
          { route: ["","login"], name: 'login', moduleId: "./login", nav: true, title: "Beginscherm" },
      ]);

      this.router = router;     

      //default route, to avoid the "route not found error"
      config.mapUnknownRoutes(instruction => {
        return './login';
      });
  }

Authorised Router

configureRouter(config, router) {
      config.title = "Super Secret Project";
      config.map([
          { route: [ '', 'screen-1'], moduleId: "./screen-1", nav: true, title: "Beginscherm" },
          { route: 'screen-2', name:'screen-2', moduleId: "./screen-2", nav: true, title: "Beginscherm" }
      ]);

      //default route, to avoid "route not found" error
      config.mapUnknownRoutes(instruction => {
        return './screen-1';
      });

      this.router = router;        
  }

Running example https://gist.run/?id=c3990aa3a5cbe22dc05bce2fdda0269a

Please, do not use Plunker, it's very slow. Use GistRun instead :)

Upvotes: 0

Related Questions