Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to create Angular2 library with multiple routes?

I'm pretty new to Angular2 and I have a requirement to build a reusable library which will be consumed by multiple applications as a html tag.

This reusable library will have multiple pages like search, create, edit etc., which translates to multiple routes within the library itself. But most of the libraries on Git do not use router.

So my question is how to design my multi page reusable library?

Should I put everything (search, create, edit) in a single component and use ngIf to show/hide the sections within the same page. But I believe there should be some way to handle routing in a library without messing up with the consuming application routes.

Can you please suggest me a design approach. It would be of great help even if you can point me to some guide or post on how to build Angular2 library.

like image 373
abmak Avatar asked Jan 13 '17 21:01

abmak


People also ask

Can we have multiple routes in Angular?

Auxiliary routes allow you to use and navigate multiple routes. To define an auxiliary route you need a named router outlet where the component of the auxiliary route will be rendered. Since we are using an empty path, the sidebar component will be rendered when our application is started.

Can we use 2 router outlet in Angular?

You can have multiple router-outlet in same template by configuring your router and providing name to your router-outlet, you can achieve this as follows. Advantage of below approach is thats you can avoid dirty looking URL with it. eg: /home(aux:login) etc.

Can I use multiple router outlets in Angular 8?

This means that you will be able to access parameters and route information from multiple outlets simultaneously when using the Router service.


1 Answers

I would avoid putting routing information directly in a library. Every application that builds up on your library might have different routing mechanisms: Different route names, different route guards, maybe even different routing libraries.

If you ship your library with pre-configured routing out of the box, you force users of your library to follow your routing ideas. If someone has a route "/search" defined already and you perhaps overwrite that route, that will cause frustration. Similarly, if someone decides to use a custom routing service rather than Angular's, they might not be able to use your library. Or if someone wants to put all views into one Component in a tabbed view, that might not be easily possible.

My recommendation is to ship an NgModule which declares a number of Components. Allow your users to use these components the way they want to. If they use all your components, they can set up one route per component. If they want to put all of them in tabs on one page, they can do that, too.

like image 158
fjc Avatar answered Oct 07 '22 01:10

fjc