diff --git a/Projektarbeit-3/Umsetzung.md b/Projektarbeit-3/Umsetzung.md index da54544..b8296c6 100644 --- a/Projektarbeit-3/Umsetzung.md +++ b/Projektarbeit-3/Umsetzung.md @@ -460,7 +460,7 @@ const NbBlockedDocks = this.station.status.NbDocks - this.station.status.NbBikes ### Toolbar Die Toolbar ist auf Top-Level Ebene angesiedelt und wird sowohl im Dashboard als auch auf der Startseite angezeigt. Nur der Inhalt der Toolbar unterscheidet sich je nach Route: - +
align="center"> @@ -479,6 +479,43 @@ Die Toolbar ist auf Top-Level Ebene angesiedelt und wird sowohl im Dashboard als
Startseite
+
+ +Programmatisch wird über `ngIf` geprüft, ob die Route entweder das Schlagwort "dashboard" besitzt. + +```html +
+ +
+
+ +
+``` +#### auto-refresh +Wir wollten dem User die Möglichkeit geben, in Echtzeit die Stationen zu analysieren. Mit dem Auto-Refresh, haben wir sichergestellt, dass alle 10 Sekunden unser Backend angesprochen wird und die aktuellen Informationen auf der Map anzeigt. + + + + + + +
+
+ +
+
+ +```typescript +this.interval = setInterval(() => { + if (this.isFlagActive) { + this.map.autoRefresh().catch(error => console.log(error)); + } +}, 10000); +``` + +
+ +Ist der Auto-Refresh aktiv, wird alle 10 Sekunden eine Methode im Map Service aufgerufen, welche das Backend für neue Informationen anspricht und alle Layer neu generiert. ### Dashboard * Aufbau der Seite in Komponenten, detaillierte Erklärung in Unterkomponenten