Cristi Cristi - 1 month ago 26x
AngularJS Question

Angular 2 multiple CRUD components: routing or a parent component

I have an application with multiple sections that are more or less independent CRUD components.

As far as I know there are two ways to approach this:

  • Have a parent with ngIfs that handle view/edit/add children

  • Use subrouting with an outlet in every parent component and routers that go something like /section/edit, /section/view, and what not.

My question is what's the best practice to approach this. I'd tend towards the first since it allows user to do stuff like editing multiple sections at once, but programatically it doesn't seem as elegant as the second one.


I use routing when I want to change the whole view. For instance, the user detail and the user edit views are very different in my app, so I used routing.

I use sub-components when I need to control a small, reuseable section of the view. For instance, a user card within a list of all users, a comment div within a list of comments on a post board, or a side menu that will be used in multiple views.

Something to consider: routing makes it a lot easier for users to share and save links to specific views, and to navigate back and forth. I wish I had really internalized that earlier because my app is now in a state in which I want to replace several *ngIf controlled views with routes. For instance, as a customer fills out a multi-step form, I have *ngIf="step==1, *ngIf="step==2" to control the view. But customers expect that if they hit Back in browser nav bar, it will take them to the previous step. Because I didn't plan carefully enough, this takes them to the previous route which means when they return to the form, they are back to step 1.