I will start a new project and I want to use Angular 2. The project will have a main page and 3 different user panels (dashboard). Each panel will be a large application.
Example:
- localhost
- localhost/admin
- localhost/student
- localhost/parents
I think to build them as separate Angular Apps. But I don't know if it is logical or what is the best practise for that.
Today I just wanted to try it and created two different apps. First app has only one button with the link of second app (localhost/admin). It works fine. When I click the button I see "localhost/admin" in the address bar.
export class LoginComponent {
constructor() {
}
goToAdminPanel(){
window.location.href = "http://localhost/admin";
}
}
But when the address has changed the second app doesn't load. Shows the "Loading" message and stops.
On the console it says that can't find bundle.css and bundle.js files under localhost.
http://localhost/styles.d41d8cd98f00b204e9800998ecf8427e.bundle.css
http://localhost/styles.b2328beb0372c051d06d.bundle.js
http://localhost/styles.b2328beb0372c051d06d.bundle.js
http://localhost/main.819cb8811b8bbdc925f6.bundle.js
It's normal because the second app (Admin Panel) is not in the root folder. It's under localhost/admin
I changed the base hrefs as
- First App:
<base href="/"> - Second App:
<base href="/admin">
The folder structer is:
- All files of First App is in locahost
- All files of Second App is in localhost/admin folder
What are your advices to build this kind of structer with Angular 2
