Hej, chciałbym w ramach jednej aplikacji angularowej zrealizować obsługę strony oraz panelu administratora. Część ze stroną już mam gotową, teraz chciałbym w ten raczej standardowy szablon aplikacji wpleść panel administratora, który ma korzystać z całkowicie innego szablonu. Zastanawiam się jak to można zrealizować i osiągnąć? Problem generalnie polega na tym, że chyba w jakiś sposób powinienem dodać drugi index.html. Spotkał się ktoś już z czymś takim i mógłby się podzielić wiedzą jak najlepiej to zrobić?

- Rejestracja:ponad 17 lat
- Ostatnio:około godziny
W angular.json masz file replacements i tam mozesz tez podmienic index.html na inny plik raz zdarzylo mi sie tak zrobic bo jakis tam klient chcial inny header/stopke czy tam jakies logo nie pamietam.
Ale ogolnie ja na twoim miejscu zrobilbym 2 appki czy to w jakims monorepo czy 2 roznych zalezy czy masz jakies czesci kodu ktory chcialbys wykorzystac w jednym i drugim bez babrania sie z gitem w jakies submodules itd....
- Rejestracja:około 6 lat
- Ostatnio:ponad 3 lata
- Postów:141
@marcio: Właśnie w międzyczasie doczytałem na temat subaplikacji w ramach jednej aplikacji. Ogólnie wszystko spoko. Tylko jedno pytanie - chciałbym obydwie apki uruchamiać z jednego ngserve i w dodatku chciałbym mieć jeden wspólny routing, który pozwoliłby na płynne przejście pomiędzy aplikacjami (problemem tutaj jest to, ze one mają całkowicie inne layouty).
- Rejestracja:prawie 10 lat
- Ostatnio:ponad 3 lata
- Postów:375
A po co Ci 2 strony index.html albo jakakolwiek podmiana? Możesz to zrobić tak, że twój AppComponent
ma tylko <router-outlet>
. Teraz masz dwa komponenty:
HomeComponent
- dla zwykłego użytkownika (osobny moduł)AdminComponent
- dla admina (osobny moduł)
I w nich masz kolejny router-outlet
do wyświetlania komponentów już stricte dla np. HomeComponent
. Do tego możesz sobie zastosować LazyLoading modułów ( https://angular.io/guide/lazy-loading-ngmodules ) i children routy dla tych dwóch modułów ( https://angular.io/guide/router ).
- Rejestracja:około 6 lat
- Ostatnio:ponad 3 lata
- Postów:141
@Aisekai:
Zrobiłem coś takiego:
const routes: Routes = [
{
path: 'app1',
loadChildren: () => import('../../projects/app1/src/app/app1.module').then((m) => m.App1SharedModule),
},
{
path: 'app2',
loadChildren: () => import('../../projects/app2/src/app/app2.module').then((m) => m.App2SharedModule),
}
];
Z tym, że mam taki objaw, że domyślnie wchodząc na localhost:4200 odpala mi się app1, natomiast jak wpisuję w urlu końcówkę 'app2' to mimo wszystko ładuje się app1. Co tu może nie grać?
- Rejestracja:prawie 10 lat
- Ostatnio:ponad 3 lata
- Postów:375
Co znaczy, że ładuje Ci się app1? Czym się to objawia? W sensie leci do bundle? Pewnie leci z tego powodu, że masz go zadeklarowanego gdzieś w AppModule
, ewentualnie importujesz App1SharedModule
który eksportuje App1Component
. Idea jest taka, że masz dwa moduły, które w "odpowiednim momencie" będą się dociągać do bundle, żeby nie pobierać zbyt dużo niepotrzebnego (od strony końcowego użytkownika) kodu. Twoimi "drugim plikiem index.html" (a w przyszłości możliwe że będą takie więcej) byłby inny komponent renderowany za pomocą router-outlet
w AppComponent
. Jeżeli możesz, wrzuć gdzieś to repo na githuba, to zerknę.
- Rejestracja:około 6 lat
- Ostatnio:ponad 3 lata
- Postów:141
@Aisekai: Wiesz co, już to ogarnąłem. Jeszcze jedynie jedno pytanie, czy da się zrobić tak, zeby wymienialny był cały index.html? Bo teraz mam to tak, ze to są jakby dwa osobne projekty, ale ładują jedynie moduł, a nie zmieniają mi indexu.
Zarejestruj się i dołącz do największej społeczności programistów w Polsce.
Otrzymaj wsparcie, dziel się wiedzą i rozwijaj swoje umiejętności z najlepszymi.
AisekaiAppComponent