1

I have an angular app. When not logged in, I redirect to an unauthorised page. To do this, I re-ordered my routes so one with no navigation was available as this usually is the component that holds the first router outlet so pages load in the content of the side navigation.

const routes: Routes = [
  { path: 'unauthorised',  component: UnauthorisedComponent },
  { path: '', component: SideNavigationComponent,
    children: [
      { path: '', component: LandingPageComponent },
      { path: 'bookaholiday', component: BookAholidayComponent }]
  },
];

This works fine, the redirect to unauthorised works and the normal page works. But if I reload the page with F5 so Im already on my bookaholiday page, it fails to render correctly??? One of my services loads weird and its styles are lost, some of the layout gets extra spans... I cannot event think how to question whats happening. Any ideas at all welcome.

Aaron Gibson
  • 1,280
  • 1
  • 21
  • 36
  • 1
    can you check the console and see if there is any errors? – Hussein Apr 21 '18 at 22:38
  • I did, there are no errors. Nothing is failing to actually load, its like a fault in the order of loading almost. I'm slowly removing components to see if anything is triggering this but I have nothing. – Aaron Gibson Apr 21 '18 at 23:04
  • i usually have style issues in angular when there are errors, also in your routes i think there are 2 different components for the same route: `SideNavigationComponent` and `LandingPageComponent ` – Hussein Apr 21 '18 at 23:09
  • Mmm one stupid thing but for try... in the children array, change the order, first bookaholiday and second the ' ' – Kalamarico Apr 21 '18 at 23:15
  • Now i'm seeing, it's strange to have a children ' ' in the path: ' ' – Kalamarico Apr 21 '18 at 23:17
  • This also works fine if I remove the child routes and just work on a single router. Which also doesn't give me any answers on why this is broken. – Aaron Gibson Apr 23 '18 at 09:40

0 Answers0