Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
1
Was bringt AngularJS 2.0?
Manfred Steyer
ManfredSteyer
Über mich …
Manfred Steyer
Trainer & Berater
Angular & ASP.NET...
2
Ziel
Überblick über Angular 2
Beispiel mit Visual Studio Code
Ausblick: Angular 2 und ASP.NET
Folie 3
MOTIVATION
Pag...
3
Plattformen und Usability
HTML + JavaScript
Single Page Application
High-Level Architektur
Page  6
Services
HTML/
JavaS...
4
Angular 1
Page  10
Community Verbreitung
Eco-
System
Angular 1
1.1 Million
Developers
5
angular-connect, Herbst 2015, London
Folie 12
angular-connect, Herbst 2015, London
Folie 13
6
ANGULAR 2
Page  14
Fokus
Folie 15
Performance Mobile
Komponenten Modern Web
7
KOMPONENTEN IN ANGULAR 2
Page  16
Component Controller
Page  17
@Component({
selector: 'flug-suchen',
templateUrl: 'fl...
8
Bindings
Page  18
<input [(ngModel)]="von">
[…]
<table [hidden]="fluege.length == 0">
<tr *ngFor="#flug of fluege">
<td...
9
DEMO
Page  20
ANGULAR & ASP.NET ?
Page  21
10
Angedachte Möglichkeiten
[Metadaten aus Models für Formulare und
Validierung]
Serverseitiges Rendering
10 x Startup-...
11
manfred.steyer@SOFTWAREarchitekt.at
SOFTWAREarchitekt.at
ManfredSteyer
Kontakt
Upcoming SlideShare
Loading in …5
×

Was bringt Angular 2?

528 views

Published on

Vortrag von .NET Cologne, Mai 2016, Kölln

Published in: Internet
  • Be the first to comment

  • Be the first to like this

Was bringt Angular 2?

  1. 1. 1 Was bringt AngularJS 2.0? Manfred Steyer ManfredSteyer Über mich … Manfred Steyer Trainer & Berater Angular & ASP.NET Page  2
  2. 2. 2 Ziel Überblick über Angular 2 Beispiel mit Visual Studio Code Ausblick: Angular 2 und ASP.NET Folie 3 MOTIVATION Page  4
  3. 3. 3 Plattformen und Usability HTML + JavaScript Single Page Application High-Level Architektur Page  6 Services HTML/ JavaScript-Client HTTP Single Page Application (SPA)
  4. 4. 4 Angular 1 Page  10 Community Verbreitung Eco- System Angular 1 1.1 Million Developers
  5. 5. 5 angular-connect, Herbst 2015, London Folie 12 angular-connect, Herbst 2015, London Folie 13
  6. 6. 6 ANGULAR 2 Page  14 Fokus Folie 15 Performance Mobile Komponenten Modern Web
  7. 7. 7 KOMPONENTEN IN ANGULAR 2 Page  16 Component Controller Page  17 @Component({ selector: 'flug-suchen', templateUrl: 'flug-suchen.html', directives: [NgFor, NgIf] }) export class FlugSuchen { von: string; nach: string; fluege: Array<Flug>; constructor(flugService: FlugService) { } flugSuchen() { [...] } selectFlug(flug) { [...] } }
  8. 8. 8 Bindings Page  18 <input [(ngModel)]="von"> […] <table [hidden]="fluege.length == 0"> <tr *ngFor="#flug of fluege"> <td>{{flug.id}}</td> <td>{{flug.datum}}</td> <td>{{flug.von}}</td> <td>{{flug.zu}}</td> <td><a href="#" (click)="selectFlight(flug)">Select</a></td> </tr> </table> View Page  19 <input bindon-ngModel="von"> […] <table bind-hidden="fluege.length == 0"> <tr template="ngFor: var flug of fluege"> <td>{{flug.id}}</td> <td>{{flug.datum}}</td> <td>{{flug.abflugOrt}}</td> <td>{{flug.zielOrt}}</td> <td><a href="#" on-click="selectFlug(flug)">Auswählen</a></td> </tr> </table>
  9. 9. 9 DEMO Page  20 ANGULAR & ASP.NET ? Page  21
  10. 10. 10 Angedachte Möglichkeiten [Metadaten aus Models für Formulare und Validierung] Serverseitiges Rendering 10 x Startup-Performance SEO Reichweite Folie 22 DEMO Page  23
  11. 11. 11 manfred.steyer@SOFTWAREarchitekt.at SOFTWAREarchitekt.at ManfredSteyer Kontakt

×