Tweet
Tweet

Slide 1

Slide 1 text

Ein Blick in die Zukunft Angular's neue Kontrollstrukturen

Slide 2

Slide 2 text

Dominik Pieper About me • Frontend Architekt • Nx Champion • Consultant • Coach • Mentor Contact • Twitter: @dominik_pieper • eMail: [email protected]

Slide 3

Slide 3 text

Neue Kontrollstrukturen • Neu ab Angular 17 • Alte Direktiven nicht so ganz intuitiv • Erweiterung des Angular Templates • npx -p @angular/[email protected] ng new ng17project

Slide 4

Slide 4 text

*ngIf -> @if

Slide 5

Slide 5 text

*ngIf -> @if

Slide 6

Slide 6 text

*ngFor -> @for Required

Slide 7

Slide 7 text

*ngFor -> @for

Slide 8

Slide 8 text

*ngFor -> @for Nicht bei Request

Slide 9

Slide 9 text

*ngFor -> @for • $index : number • $even : boolean • $odd : boolean • $count : number • $first : boolean • $last : boolean

Slide 10

Slide 10 text

*ngSwitch -> @switch

Slide 11

Slide 11 text

@defer • idle • interaction • immediate • timer(x) • hover • viewport

Slide 12

Slide 12 text

@defer

Slide 13

Slide 13 text

Performance

Slide 14

Slide 14 text

VSCode Unterstützung und Migration • Download von Github • code --install-extension ~/Downloads/ng-template.vsix • ng g @angular/core:control-flow-migration

Slide 15

Slide 15 text

Vielen Dank für die Aufmerksamkeit