Multiple html pages inside one component in angular

0
votes

How do I get to use multiple HTML pages inside one angular component. I have 3 types of users. Admin, Doctor and User. Each one have their unique dashboard, settings and other pages. Can I have 3 components called admin, doctor and user and makes dashboard.html, settings.html etc. for each component.

Example:

For user:

website/user/login

website/user/dashboard

website/user/settings

For doctor:

website/doctor/login

website/doctor/dashboard

website/doctor/settings

Do I have to create component for each and every single page? Or is there another way?

I'm using Angular CLI: 11.0.2

and Node:15.1.0

1
javascriptangular
I would create a component for each page that contains all your child components. - robbieAreBest

1 Answers

3
votes

The great thing about components is that they can be reused. Try to design your app as modularly as possible.

For example the settings component for users and doctors will likely be different, but also have some overlap. Why not create a general-settings component, that contains the shared logic and only implement the role specific functionality in separate components.

Another possibility would be to show or hide role specific settings based on the current route (e.g. user or doctor).