|
1 | 1 | # AngularConfigLoading |
2 | | - |
3 | | -This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 14.0.5. |
4 | | - |
5 | | -## Development server |
6 | | - |
7 | | -Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The application will automatically reload if you change any of the source files. |
8 | | - |
9 | | -## Code scaffolding |
10 | | - |
11 | | -Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`. |
12 | | - |
13 | | -## Build |
14 | | - |
15 | | -Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. |
16 | | - |
17 | | -## Running unit tests |
18 | | - |
19 | | -Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io). |
20 | | - |
21 | | -## Running end-to-end tests |
22 | | - |
23 | | -Run `ng e2e` to execute the end-to-end tests via a platform of your choice. To use this command, you need to first add a package that implements end-to-end testing capabilities. |
24 | | - |
25 | | -## Further help |
26 | | - |
27 | | -To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page. |
| 2 | +### Idee |
| 3 | +Manchmal möchten wir die environment.properties extern pflegen und stage-abhängig zur Verfügung stellen. |
| 4 | +Das Beispiel zeigt eine Idee, wie Konfigurationen vor dem Bootstrapping der Angular-App geladen werden können. |
| 5 | +1. Wir erstellen uns eine typisierte [AppConfig](src/app/config/app.config.ts) |
| 6 | +2. Wir erweitern unsere [environment.ts](src/environments/environment.ts) und [environment.prod.ts](src/environments/environment.prod.ts) um die AppConfig |
| 7 | +3. Wir sorgen mit der Fetch API in der [main.ts](src/main.ts), dass die externe Konfiguration hier: [env.json](src/assets/env.json) vor dem Bootstrapping der Angular-App geladen wird! Über ein "Object.assign" mergen wir die env.json und environment.ts |
| 8 | +4. Wir könnne dann überall in der App auf die Properties typisiert zugreifen: [app.component.ts](src/app/app.component.ts) |
| 9 | + |
| 10 | +Fertig :) |
| 11 | +### Wo kommt die Konfiguration nun her? |
| 12 | +Hier im Beispiel liegt sie im assets Ordner. |
| 13 | +* Man könnte aber über die Fetch API auch jede beliebe andere URL aufrufen (Achtugn CORS). |
| 14 | +* Man könnte aber auch über eine entsprechende K8s Konfiguration beim Start des PODs die env.json dynamisch in den assets Ordern "linken"... |
| 15 | +* Es gibt sicher weitere Möglichkeiten... dedizierten Config-Server im K8s Cluster |
0 commit comments