Home:ALL Converter>Angular 2 Child Routes

Angular 2 Child Routes

Ask Time:2016-07-26T06:10:23         Author:Peter

Json Formatter

I used the angular-cli tool to create my routes. It makes a folder with a + in front of it i.e.

  • +dashboard
  • +document

I can't work out how to make a child route using the angular-cli tool. That really doesn't matter but I would prefer to adopt an agreed to convention in my application structure for describing a child route.

So what do I do?

Do I put a folder under the parent route like this

  • app\+document\+chapter

Is it better to do this kind of thing

  • app\+document
  • app\+chapter

Beyond that I'm a bit confused about routes in general. my understanding is that there's been a deprecated route and a new route. I think I'm using the new system as it has been generated with the angular-cli tool. Anyway I'm nesting multiple levels of child routes. And I was wondering if this looks legit.

@Routes([
  { path: '/', component: DashboardComponent },
  { path: '/document/:id', component: ReaderComponent,
      children: [
          { path: '', redirectTo: 'chapter/0', pathMatch: 'full' },
          { path: 'chapter/:id', component: ChapterComponent,
            children: [
              { path: '', redirectTo: 'para/0', pathMatch: 'full' },
              { path: 'para/:id', component: ParagraphComponent }
           ]}
      ]
  }
])

So http://my-url/document/1 should take me to http://my-url/document/1/chapter/0/para/0 Is this the best way to do this? I like it because it allows deep linking etc. It also appears redirectTo doesn't work.

But I'm a bit new to all this and I'm wanting to keep my application design as 'conventional' as possible

Author:Peter,eproduced under the CC 4.0 BY-SA copyright license with a link to the original source and this disclaimer.
Link to original article:https://stackoverflow.com/questions/38578195/angular-2-child-routes
yy