Replies: 17 comments
-
|
Angular Coding Style Guide: https://angular.dev/style-guide |
Beta Was this translation helpful? Give feedback.
-
|
HTML für Komponente <div class="card mb-4">
<div class="card-body bg-light">
<img class="img-thumbnail float-end" alt=""
src="https://api.angular.schule/avatar/{{ book().rating }}">
<div class="card-title">
<h2>
{{ book().title }}
<span class="badge bg-secondary">{{ book().rating }}</span>
</h2>
</div>
<p>{{ book().description }}</p>
<p>Preis: {{ book().price }}</p>
</div>
</div> |
Beta Was this translation helpful? Give feedback.
-
|
LinkedSignal: https://angular-buch.com/blog/2024-11-linked-signal |
Beta Was this translation helpful? Give feedback.
-
Freiwillige Hausaufgabe (1)
|
Beta Was this translation helpful? Give feedback.
-
|
Model Inputs: Kombination von Input und Output |
Beta Was this translation helpful? Give feedback.
-
// Verschachteltes Objekt klonen mit Spread-Operator
const myObj = {
title: 'Angular',
year: 2016,
author: {
firstname: 'F',
lastname: 'M'
}
}
const myCopy = {
...myObj,
author: {
...myObj.author,
firstname: 'L'
}
}
// Deep Copy
const myCopy2 = structuredClone(myObj); |
Beta Was this translation helpful? Give feedback.
-
|
Does it mutate? |
Beta Was this translation helpful? Give feedback.
-
Freiwillige Hausaufgabe (2)Buttons deaktivierenDeaktiviere die Buttons in der Resource APILies den Blogpost zur Resource API durch: https://angular-buch.com/blog/2024-10-resource-api |
Beta Was this translation helpful? Give feedback.
-
Freiwillige Hausaufgabe (3)Bücher löschen
|
Beta Was this translation helpful? Give feedback.
-
Vorbereitung für Formulare, Suche und Child RoutesFür die nächsten Übungen benötigen wir einige neue Komponenten und Routen:
Wenn die Anwendung unter http://localhost:4200 aufgerufen wird, soll die neue Startseite zu sehen sein (nicht das Dashboard). Baue eine Navigationsleiste, die dauerhaft in der Komponente Für |
Beta Was this translation helpful? Give feedback.
-
Freiwillige Hausaufgabe (4)Datum anzeigen
optionale Zusatzaufgabe: eigener ValidatorEntwickle einen eigenen Validator ( |
Beta Was this translation helpful? Give feedback.
-
🎮 NEU: RxJS PlaygroundDu kannst dir entweder
cd rxjs-playground
npm install
ng serveÖffne den Browser unter der URL http://localhost:4300 (!), um die Anwendung zu sehen. |
Beta Was this translation helpful? Give feedback.
-
|
Falsy Values: |
Beta Was this translation helpful? Give feedback.
-
|
Interaktive Marble-Diagramme für RxJS: https://rxmarbles.com |
Beta Was this translation helpful? Give feedback.
-
Freiwillige Hausaufgabe (5)Erstelle ein Observable, das die Elemente eines Arrays in einem Intervall ausgibt.
Es gibt verschiedene mögliche Lösungswege! Als Zusatz kannst du die Logik in eine eigene Creation Function verpacken: function delayedFromArray<T>(arr: T[], delayMs: number): Observable<T> {
// TODO
} |
Beta Was this translation helpful? Give feedback.
-
Typeahead-SucheImplementiere eine Typeahead-Suche. Nutze als Basis dafür den Datenstrom
|
Beta Was this translation helpful? Give feedback.
-
ZusatzaufgabenRxJS PlaygroundHier gibt es noch die offene Aufgabe und "Dragdrop". Die Lösung für das Dragdrop findet ihr im Repo. Refactoring des bestehenden Formulars (Reactive Forms)Teile das Formular zum Erstellen von Büchern in zwei Komponenten auf. Das reine Formular soll in einer eigenen neuen Komponente liegen, z. B. Bücher bearbeiten
|
Beta Was this translation helpful? Give feedback.
Uh oh!
There was an error while loading. Please reload this page.
-
Herzlich Willkommen! 🎉 Hier können wir während der Schulung Links und Codeschnipsel teilen.
Beta Was this translation helpful? Give feedback.
All reactions