Angular 2 Grundkurs

Was ist neu?

LinkedIn Learning kostenlos und unverbindlich testen!

Jetzt testen Alle Abonnements anzeigen
In Angular 2.0 hat sich viel getan! Was neu ist und welche Unterschiede zu AngularJS 1.0 bestehen, verrät dieses Video.
05:48

Transkript

Einige von euch haben bereits vielleicht mit Angular 1 gearbeitet. Und diese Leute werden sich jetzt fragen: Was ist eigentlich neu an Angular 2.0? Ich möchte euch in den kommenden Minuten einen kurzen Überblick darüber geben. Im Wesentlichen, das ist das Entscheindenste, ist Angular nicht nur ein Update im klassischen Sinne, sondern Angular 2.0 wurde wirklich komplett neu geschrieben. Dieses "komplett neu geschrieben" bedeutet: Technologien wurden etwas ausgetauscht und die Core-Technologie, die hinter Angular steckt, ist ebenfalls komplett überarbeitet worden. Und der Fokus bei dieser Überarbeitung lag im Wesentlichen auf der Performance. Das heißt, wir haben es geschafft, im Gegensatz zu Angular 1 drei- bis fünfmal schneller zu sein. Weiter arbeitet Angular 2.0 ganz ganz stark mit Komponenten. Alles, was ich also innerhalb einer Anwendung mache, packe ich in eine Komponente, damit ich das dann als View-Element darlegen kann und verwenden kann in meiner Applikation. Auch die modulare Arbeitsweise nach ECMAScript-2015-Standard ist ein wesentlicher Vorteil von Angular 2.0, denn ich bin nun in der Lage, meine Module nicht mehr wie früher in Angular 1 explizit zu erstellen und abzulegen, sondern ihre TypeScript-Datei ist automatisch im Modul. Alles, was ich darin exportiere, kann ich dann auch anschließend in anderen Modulen dann importieren, weiter nutzen etc. Wenn wir schon darüber sprechen, was jetzt in Angular 1 und Angular 2 war, lasst uns nochmal ganz diffizil auf die Unterschiede gehen. Im Wesentlichen Folgendes: Komponenten statt Kontroller. Wir müssen uns das Ganze so vorstellen: Wir sind in Angular 1 jederzeit in der Lage, einfach mit ngController einen Kontroller an ein HTML-Element zu binden, und damit Funktionalität zu binden. Angular 2.0 sagt: Ich möchte eigentlich komponentenbasierter arbeiten. Das heißt, jedes Element, das eine besondere Bedeutung hat und das mit Logik vereinheitlicht werden soll, soll zwingend eine Komponente sein. Man kann sich diese Komponente ein wenig so vorstellen wie die Direktiven, die ich in Angular 1 gemacht habe, wo ich über Restrict definiert habe: Das soll ein HTML-Element sein. Das ist nicht viel mehr, oder nicht großartig anders. Das heißt, das wird dann mittels der Komponente festgehalten, und es ist ganz wichtig, zu verstehen, dass wir nicht mehr den klassischen Kontroller haben. Dann brauchen wir den Scope nicht mehr. Und ich bin ganz ehrlich: Ich mag es, dass wir den Scope nicht mehr haben. Ich habe auch in Angular 1 ganz, ganz doll das bindToController verwendet. Ich habe mit Aliases gearbeitet, damit ich direkt auf Kontroller- Instanzen drauf kann, und auf Kontroller- Eigenschaften drauf kann. Und ich persönlich finde es sehr wertvoll, dass der Scope jetzt endgültig weg ist und ich dann direkt mit der Komponenten-Instanz arbeiten kann und dort auch Bindungen und Co. erledigen kann. Die Standardmodule sind durch ECMAScript-2015-Module ersetzt worden. Das hatte ich gerade schon kurz erwähnt. Und weiter ist als Unterschied zu erwähnen, dass AngularJS jetzt in der Version 2.0 mit unterschiedlichen Programmiersprachen entwickelt werden kann. Ich kann zum Einen in ECMAScript 5 arbeiten. Das ist das JavaScript, wie es ältere Browser schon konnten. Ich kann mit Dart arbeiten, der Programmiersprache von Google. Oder aber, ich kann mit TypeScript arbeiten. Angular 2.0 selbst ist mit TypeScript entwickelt. Deswegen würde ich natürlich jedem empfehlen, mit TypeScript zu arbeiten. Der Grund, warum das Ganze passiert, ist relativ einfach. TypeScript arbeitet schon ganz, ganz dicht an ECMAScript 2015. Ich bin noch zusätzlich in der Lage, mit Dekoratoren und Co. zu arbeiten. Also, es ist sehr, sehr effizient, damit zu arbeiten. Also, meine Empfehlung: Wenn Angular 2.0 mit TypeScript entwickelt worden ist, solltet ihr ebenfalls mit TypeScript arbeiten. Macht euch auch nicht vollkommen wahnsinnig. Die Lernkurve von TypeScript ist wirklich sehr steil. Ihr werdet sehr schnell reinkommen. Warum der Grund nochmal war, damit TypeScript verwendet wurde: Wie gesagt, TypeScript arbeitet sehr ähnlich wie ECMAScript 2015, mit Klassen, Interfaces, Vererbung, ich kann die Templates aus dem ECMAScript 2015 verwenden ich kann Backticks verwenden, beispielsweise, wenn ich mehrzeilige Templates dann verwenden muss, muss nicht mehr diese String-Operationen machen. Ich bin typisiert. Das heißt, ich bin in der Lage, dass ich sagen kann, dass ein bestimmter Parameter von einem bestimmten Typ sein muss. Ich kann Annotationen verwenden und Vieles, Vieles mehr, die mir durch TypeScript dann noch dazukommen. Das bedeutet im Wesentlichen also für mich, dass Angular 2.0 mit TypeScript ECMAScript-2015-konform wird und TypeScript gleichzeitig in der Lage ist, für alle Browser den Code in ECMAScript 5 auszugeben. Und damit diese ECMAScript-5-Schreibweise vernünftig funktioniert, denn ich werde einige ECMAScript-6- beziehungsweise ECMAScript-2015- Befehle benutzen, werde ich zwingend notwendig noch Polyfills benötigen, damit weniger moderne Browser in der Lage sind, Angular-Anwendungen zu verstehen. Das heißt, im Gegensatz zu früher müssen wir tatsächlich einige Polyfills implementieren, damit weniger moderne Browser ECMAScript-6-Funktionalitäten lernen. Und um die unterschiedlichen Module, die ich erzeuge, dann laden zu können, kann ich jetzt unterschiedliche Systeme verwenden. System.js werde ich in diesem Training häufiger verwenden. Es wäre aber technisch auch ohne Probleme möglich, mit webpack zu arbeiten. Nur als kurze Idee: Alles, was ihr in TypeScript hinterlegt, das ist modular. Ihr könnt beliebige TypeScript-Dateien importieren oder vielmehr exportierte Elemente anderer TypeScript-Dateien importieren. Und System.js sowie webpack schafft das Ganze dann, in Pakete zu bündeln und bei Bedarf dann die JavaScripts dann zu laden und zu steuern. In diesem Video haben wir die Unterschiede kennengelernt zu Angular und Angular 2.0.

Angular 2 Grundkurs

Lernen Sie Angular 2 von Grund auf kennen und erkunden Sie die Möglichkeiten der Bindungen sowie den Einsatz von Direktiven und Pipes.

4 Std. 37 min (65 Videos)
Derzeit sind keine Feedbacks vorhanden...

Dieser Online-Kurs ist als Download und als Streaming-Video verfügbar. Die gute Nachricht: Sie müssen sich nicht entscheiden - sobald Sie das Training erwerben, erhalten Sie Zugang zu beiden Optionen!

Der Download ermöglicht Ihnen die Offline-Nutzung des Trainings und bietet die Vorteile einer benutzerfreundlichen Abspielumgebung. Wenn Sie an verschiedenen Computern arbeiten, oder nicht den ganzen Kurs auf einmal herunterladen möchten, loggen Sie sich auf dieser Seite ein, um alle Videos des Trainings als Streaming-Video anzusehen.

Wir hoffen, dass Sie viel Freude und Erfolg mit diesem Video-Training haben werden. Falls Sie irgendwelche Fragen haben, zögern Sie nicht uns zu kontaktieren!