Aus was besteht eine Angular Application ?
Aus Components und Services, die den Components ihre funktionalität geben.
Aus was besteht ein Component in einer Angular Application ?
Ein Component besteht aus :
- einem Template, was das HTML für die Benutzeroberfläche ist, dass eine View für die Application definiert.
- einer Klasse die den Code, der zu der View gehört, beinhaltet. Die Klasse enthält die
1. Properties bzw Data Elements, die die View benutzen kann
2. Methoden die Actions ausführen für die View wie auf ein Button zu antworten - Metadata, die weitere Informationen über den Component zu Angular liefern. Diese Metadaten sind dafür verantwortlich, dass die Klasse als ein Angular Component identifiziert
Kurz: Ein Component ist also eine View definiert von einem Template, der dazugehörige Code ist definiert mit einer Klasse und zusätzliche Informationen definiert in Metadaten
Wie fügt man die einzelnen Components zu einer Application?
Wir definieren Angular Modules, diese helfen uns unsere Components in zusammenhängende Funktionsblöcke zusammenzufassen. Jede Anwendung hat mindestens ein Angular Module, das Root-Angular-Modul
Was ist ein Decorator ?
Eine Fuktion die metadaten zu einer Klasse, seinen Membern oder seinen Methoden Argumenten hinzufügt.
Was für einen Prefix hat ein Decorator ?
@Component( )
Kann ein Component mehreren Modulen angehören ?
Nein
Wie ist der Konventionelle Namen für den Root Component ?
class AppComponent
Was sollte in @Component( ) immer enthalten sein ?
Ein Template
@Component( {
template:`
<h1>blablabla</h1>
`
} )Wie können wir externe Funktionen benutzten ?
über ein Import statement
import { Component } from ‘@angular/core’;
Angular library module || Member Name
nameSchildere den typischen aufbau eines Components in Code
import { Component } from “@angular/core”;
@Component({
selector: 'pm-root',
template: `
<div><h1>{{pageTitle}}<h1>
<div>My First Component</div>
</h1></h1></div>
`
})export class AppComponent {
pageTitle: string = 'Acme Product Management';
}Wie kriegen wir das Template des Components nun angezeigt ?
Wir geben dem component einen selector
selector: ‘pm-root’
und benutzten diesen dann in der Index.html als Tag
Was muss man mit einem Component machen, bevor man ihn benutzten kann ?
Man Bootstrapt ihn im dafür vorgesehenen Module
Warum werden “linked templates” verwendet ?
Weil in Inline Templates keine Intellisense etc.
Was ist der Unterschied zwischen einem for…of loop und einem for…in Loop ?
for. ..of ist quasi wie ein foreach, dass einfach alle Inhalte aus etwas aufzählt. Das Ergebnis ist der Inhalt des Feldes, dass geloopt wird.
for. ..in zählt nur die properties eines Objekts, dass ergebnis sind also Zahlen von 0 bis x
was muss in einem Modul deklariert und was wird importiert ?
Unsere eigene Komponenten und Pipes werden unter declarations deklariert, unter imports werden alle 3rd party bzw. von Angular erstellten Module deklariert bzw. hier geimportet
Was macht man mit Pipes in Angular?
Der gegebene Wert, geht durch die Pipe und wird anhand der Pipe transformiert wie z.B nur Uppercaase, Datum, nummer, decimal, percent, json, currency etc.
Custom Pipes
Nenne die 4 Wege von Data Binding in Angular zwischen dem Dom und einem Component
- Interpolation: Component > Dom {{pageTitle}}
2.Property Binding: Component > Dom
<img></img> - Event Binding : Dom > Component
(click)=”toggleImage()” - Two-Way Binding: Dom <> Component
Wie macht man Styles in CSS in Angular ?
Man gibt im @Component an styleUrls: [”./product-list.component.css”]
oder Inline oder nur styles:
Was macht ein Component Nest-able ?
Indem er nur Teil einer größeren View ist, einen Selector hat und optional mit dem Container in dem er sich befindet kommuniziert
Was ist ein Service ?
Eine klasse mit einem focused purpose.
Features eines Services sind, dass er unabhängig von anderen Components ist, er shared data oder logic zwischen Components verteilen kann
