Angular-cli: Enhance - ng generate route

[Brocco]

ng route update

The current mechanism to add routes does not provide the flexibility that is needed to generate routes

Current

ng route library yields:

|-- app
|   |-- library
|   |   |-- library-detail.component.html
|   |   |-- library-detail.component.css
|   |   |-- library-detail.component.spec.ts
|   |   |-- library-detail.component.ts
|   |   |-- library-list.component.html
|   |   |-- library-list.component.css
|   |   |-- library-list.component.spec.ts
|   |   |-- library-list.component.ts
|   |   |-- library-root.component.spec.ts
|   |   |-- library-root.component.ts
|   |   |-- library.service.spec.ts
|   |   |-- library.service.ts
|   |-- ...
|-- app.ts

Issues

• Not all routes will want a root, list and detail components.
• All routes are added to the root (no child routes)

• Need to be more granular with what is generated (via params)

  Concerns with new proposal

• Simplicity - make it easy for devs to use

• Style - adhere to a community accepted style guide
  

  Proposed

Create a list of parameters to configure what is generated out of ng route <name>

Parameters

• Parent [optional]
  
  
  
  • will specify where the new route will be placed
  
  
  • will allow adding of child routes without cd-ing to that route/directory
  
  
• routes [optional]
  
  
  
  • list of child routes to be created
  
  

Parameters can be specified via command line i.e.

• With children

bash ng generate route library --routes book reference

• Create base with one child then add another by specifying parent

bash ng generate route library --routes book ng generate route book --parent library

When calling the command with no arguments the user can be prompted

ng generate route
> Name of the route to generate?
> Parent route? (hit enter for no parent)
> Child route?

If more than one instance of parent is found the user will be prompted to choose

[hansl]

Parent [optional]

We could just use /s in the name and treat them as separators. I don't mind having extra arguments, but ng generate route my/parent/route/library should generate library at the right place as well.

So your example would be:

ng generate route library
ng generate route library/book

In my opinion this is good enough.

For multiple parents we need a better way of representing that anyway.

ng generate route library --routes book reference

Don't do that. If anything, use a , comma to separate arguments; ng generate route library --routes book,reference.

When calling the command with no arguments the user can be prompted

I hate prompts, and IMO the default behaviour here would show the help. If there's missing info then a prompt makes sense, but you expect a help of some sort in this case.

[filipesilva]

I think we definitely need a way add to routes within routes.

In regards to specifying the set of generated components, we would have to make them way simpler than the current setup since they are highly dependent on each other.

Perhaps the current behavior could be moved to a flag, like ng generate route hero --use-sample?

[ravtakhar]

This would be awesome and save a lot of time. In addition, make it a lot easier to learn the framework. Is anyone working on this?

[Brocco]

@ravtakhar yes, I am currently working on the generation of routes

[angularmasterflex]

@Brocco hey I wondering if you have timeline? Desperate for coding time this weekend. Thanks!

[oreon]

ng route only created one file for me as opposed to detail/list/service etc as per documentation what am I doing wrong

[Brocco]

@oreon you are doing nothing wrong, the route template is currently under construction and in a state of flux. Until it is ready you can generate a component and register it as a route in the parent component.

[Brocco]

This issue/feature has been implemented and merged as part of PR #427

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{_This action has been performed automatically by a bot._}