Оглавление
Manfred Steyer. Angular
Angular
Inhalt
Vorwort
Zielgruppe
Zielsetzung des Buchs
Quellcodebeispiele, Onlineservices und Errata
Konventionen
Aufbau des Buchs
Schulungen und Beratung
Danksagungen
KAPITEL 1. Projekt-Setup
Visual Studio Code
Angular CLI
Node.js und Angular CLI installieren
Ein Projekt mit der CLI generieren
Angular-Anwendung starten
Build mit CLI
Projektstruktur von CLI-Projekten
Internet Explorer 11
Eine Style-Bibliothek installieren
Alternativen zu Bootstrap
Zusammenfassung
KAPITEL 2. Erste Schritte mit TypeScript
Motivation
Mit TypeScript starten
Hallo Welt!
Variablen deklarieren
Ausgewählte Datentypen in TypeScript
number
string
boolean
Arrays
any
unknown
Function
Klassen und Interfaces
Ein erstes Objekt samt Modul
Auto-Importe mit Visual Studio Code
Klassen
Funktionen und Lambda-Ausdrücke
Interfaces und Vererbung
Interfaces
Klassenvererbung
Type Assertion (Type Casting)
Abstrakte Klassen
Zugriff auf die Basisklasse
Ausgewählte Sprachmerkmale
Getter und Setter
Generics
Exceptions
Spread-Operator
Strikte Null-Prüfungen
Asynchrone Operationen
Callbacks und die Pyramide of Doom
Promises
async und await
Bedeutung von Promises in Angular
Zusammenfassung
KAPITEL 3. Eine erste Angular-Anwendung
Angular-Komponente erzeugen
Komponentenlogik
Auf das Backend zugreifen
Templates und die Datenbindung
Two-Way-Binding
Property-Bindings
Direktiven
Pipes
Event-Bindings
Das gesamte Template
Komponenten einbinden
Anwendung ausführen und debuggen
Anwendung starten
Fehler in der Entwicklerkonsole entdecken
Die Anwendung im Browser debuggen
Debuggen mit Visual Studio Code
Zusammenfassung
KAPITEL 4. Komponenten und Datenbindung
Datenbindung in Angular
Rückblick auf AngularJS 1.x
Property-Binding
Event-Bindings
Das Zusammenspiel von Property- und Event-Bindings
Bindings im Template
Two-Way-Bindings
Eigene Komponenten mit Datenbindung
Überblick
Vorbereitungen
Eine Komponente mit Property-Bindings
Implementierung der Komponente mit Property-Bindings
Komponente registrieren und aufrufen
Komponenten mit Event-Bindings
Implementierung der Komponente mit Event-Binding
Komponente aufrufen
Komponenten mit Two-Way-Bindings
Life-Cycle-Hooks
Ausgewählte Hooks
Experiment mit Life-Cycle-Hooks
Angular und Zyklen
DateControl mit Life-Cycle-Hooks
Zusammenfassung
KAPITEL 5. Services und Dependency Injection
Ein erster Service
Services austauschen
Services mit klassischen Providern konfigurieren
Einen Service lokal registrieren
Arten von Providern
useClass
useValue
useFactory
useExisting
multi
Konstanten als Tokens
Zusammenfassung
KAPITEL 6. Pipes
Überblick
Built-in-Pipes
Eigene Pipes
Pure Pipes
Implementierung einer einfachen Pipe
Pipes registrieren und nutzen
Weiterführende Konstellationen
Pipes und Objekte
Pipes und Direktiven
Pipes und Services
Aufräumarbeiten mit ngOnDestroy
Zusammenfassung
KAPITEL 7. Module
Motivation
Eine Angular-typische Modulstruktur
Shared Modules
Feature-Modules
Root-Modules
Module reexportieren
Zusammenfassung
KAPITEL 8. Routing
Überblick
Erste Schritte mit dem Router
Routing-Konfiguration für das AppModule einrichten
Routing-Konfiguration für Feature-Modules einrichten
Platzhalter in AppComponent hinterlegen
Hyperlinks zum Aktivieren von Routen einrichten
Parametrisierte Routen
Arten von Routing-Parametern
Parameter in Komponenten auslesen
Parametrisierte Routen konfigurieren
Auf parametrisierte Routen verweisen
Hierarchisches Routing mit Child-Routes
Überblick über Child-Routes
Child-Komponente implementieren
Child-Komponente registrieren
Hyperlinks zum Aktivieren von Child-Routen einrichten
Aux-Routes
Platzhalter für Aux-Routes
Komponente für Aux-Route erzeugen
Konfiguration für Aux-Route
Verweise auf Aux-Routes einrichten
Mit dem Query-String und dem Hash-Fragment arbeiten
QueryString und Hash-Fragment programmatisch beeinflussen
Query-String und Hash-Fragment deklarativ beeinflussen
Query-String und Hash-Fragment auslesen
HTML5-Routing vs. Hash-Routing
PathLocationStrategy
HashLocationStrategy
Zusammenfassung
KAPITEL 9. Template-getriebene Formulare und Validierung
FormsModule einbinden
Eingaben validieren
Zugriff auf den Zustand des Formulars
Bedingte Formatierung von Eingabefeldern
Eigene Validierungsdirektiven
Eine erste Validierungsdirektive erstellen
Parametrisierbare Validierungsdirektiven
Multi-Field-Validatoren erstellen
Asynchrone Validatoren
Komponente zum Präsentieren von Validierungsfehlern
Die Standardsteuerelemente von HTML nutzen
Checkboxen
Radiobuttons
Drop-down-Felder
Zusammenfassung
KAPITEL 10. Reaktive Formulare
Erste Schritte mit reaktiven Formularen
Modul einbinden
Das Formular mit einem Objektgraphen beschreiben
Reactive Formulare mit dem FormBuilder beschreiben
Einen Objektgraphen an ein Formular binden
Werte ins Formular schreiben
Validatoren
Synchrone Validatoren
Parametrisierte Validatoren
Asynchrone Validatoren
Multi-Field-Validatoren für reaktive Formulare
Geschachtelte Formulare
Geschachtelte FormGroups
Wiederholgruppen mit FormArray
Dynamische Formulare
Zusammenfassung
KAPITEL 11. Reactive Extensions Library for JavaScript (RxJS)
Grundlegende Typen von RxJS
Observables, Observer und Operatoren
Observables instanziieren
Subjects
Observables vs. Promises
Observables in Promises umwandeln
Promises in Observables umwandeln
Gruppen von Operatoren
Creation Operators
Transformation Operators
Filtering Operators
Join Operators
Error Handling Operators
Multicasting Operators
Utility Operators
Reaktiver Entwurf
Flattening
Datenflüsse kombinieren
Der Operator combineLatest
combineLatest vs. withLatestFrom
Der Operator merge
Multicasting
Motivation für Multicasting
Hot vs. Cold Observables
Fehlerbehandlung
Observables schließen
Reaktive Services
Zusammenfassung
KAPITEL 12. Testautomatisierung
Jasmine und Karma
Aufbau eines Jasmine-Tests
Tests mit Karma ausführen
Karma auf dem Build-Server
Angular und Jasmine
Komponenten mit dem TestBed testen
Arbeiten mit Attrappen (Mocks)
Gray-Box-Tests mit Spys
HTTP-Zugriffe simulieren
Asynchrone Tests
Templates mit DOM-Zugriffen testen
Direktiven testen
Pipes testen
Testabdeckung ermitteln
Zusammenfassung
KAPITEL 13. Performancetuning
Optimierte Datenbindung mit OnPush
Datenbindung visualisieren
Immutables
Immutables und Datenbindung
Observables und Datenbindung
Immutables und/oder Observables
Manuelle Änderungsverfolgung
Lazy Loading von Routen
Routen für das Lazy Loading einrichten
Lazy Loading im Browser nachvollziehen
Lazy Loading und Tree-Shakable Provider
Lazy Loading, klassische Provider und Shared Modules
Den AuthService implementieren und nutzen
Korrekte Nutzung von SharedModules beim Einsatz von Lazy Loading
Preloading
Preloading aktivieren
Eigene Preloading-Strategien entwickeln
Selektives Preloading mit eigener Preloading-Strategie
Zusammenfassung
KAPITEL 14. Querschnittsfunktionen
Guards
Das Aktivieren von Routen verhindern
Das Deaktivieren einer Komponente verhindern
Events
Resolver
Vorbereitungen
Resolver erzeugen und verwenden
HttpInterceptoren
Zusammenfassung
KAPITEL 15. Authentifizierung und Autorisierung
Cookie-basierte Security
Cookies und XSRF
Tokenbasierte Security
OAuth 2 und OpenID Connect
OAuth 2
Benutzer mit OpenID Connect authentifizieren
JSON Web Token
OAuth-2- und OIDC-Flows
OAuth 2 und OIDC mit Angular nutzen
Zusammenfassung
KAPITEL 16. Internationalisierung
I18N mit dem Angular-Compiler
Überblick
@angular/localize installieren
Texte markieren
Strings in der Komponentenklasse markieren
Texte extrahieren
Übersetzte Texte in Builds integrieren
Sprache beim Einsatz von ng serve festlegen
Übersetzungstexte zur Laufzeit angeben
Grammatikalische Formen berücksichtigen
Unterschiedliche Formate unterstützen
Manuell weitere Formate laden
ngx-translate
Überblick
Bibliothek installieren und konfigurieren
Sprachdateien bereitstellen
Texte einbinden
Texte zur Laufzeit laden
Sprachwechsel
Grammatikalische Formen berücksichtigen
Unterschiedliche Formate nutzen
Lazy Loading
Zusammenfassung
KAPITEL 17. Reaktive Zustandsverwaltung mit NGRX (Redux)
Zustandsverwaltung mit Services
Das Redux-Muster
NGRX einrichten
Building-Blocks implementieren
State modellieren
Actions festlegen
Reducer definieren
Effect einrichten
Auf den Store zugreifen
Debuggen mit dem Store
Selektoren
Ein erster Selektor
Selektoren verschachteln
Meta-Reducer
Zusammenfassung
KAPITEL 18. Details zu Komponenten und Direktiven
Vorbereitungen
Weiterführende Aspekte von Komponenten
Content Projection
Parent-Komponenten referenzieren
View und Content
Interaktion mit dem Content
Interaktion mit der View
Den Sinn von ViewChild und ViewChildren hinterfragen
Life-Cycle-Hooks für View und Content
Statische Child-Komponenten
Zugriff auf das DOM mit der ElementRef
Zugriff auf die ViewContainerRef
Kommunikation über Template-Variablen
Kommunikation über Services
Attributdirektiven
Direktiven definieren
Mit der Umwelt kommunizieren
Direktiven und Template-Variablen
Strukturelle Direktiven
Templates und Container
Microsyntax
Eine einfache DataTable umsetzen
ViewContainerRef direkt zum Einblenden von Templates verwenden
Bestehende ViewContainer ergänzen
Dialoge dynamisch einblenden
ViewContainerRef direkt zum dynamischen Erzeugen von Komponenten verwenden
Komponenten für Formularfelder
Ausgaben formatieren und Eingaben parsen
Eigene Formularsteuerelemente
Zusammenfassung
KAPITEL 19. Wiederverwendbare Bibliotheken und Monorepos
Monorepo erstellen
Aufbau von Bibliotheken
Bibliothek in Monorepo ausprobieren
npm-Paket bauen und bereitstellen
npm-Paket konsumieren
Zusammenfassung
Index. Symbole
A
B
C
D
E
F
G
H
I
J
K
L
M
N
O
P
Q
R
S
T
U
V
W
X
Z
Über den Autor
Kolophon
