Bis Stephen Fluin traditionell eine Neuerscheinung und einen Artikel über die Funktionen des neuen Angular herausbrachte, versuchte ich alles zusammenzutragen und die Frage zu beantworten, was es Neues gibt.
Eine der coolsten Funktionen, auf die wir fast 2 Jahre gewartet haben, ist Angular Ivy, und schließlich wird Angular 9 standardmäßig mit Ivy kompiliert. Wenn Sie in das Innere von Angular Ivy eintauchen möchten, gibt es 2 Videos von AngularConnect: über Compiler und Runtime .
Wie immer mit der Angular CLI können Sie ganz einfach ein Upgrade durchführen, eine ausführliche Anleitung .
Template Typprüfung
Das strictTemplates-Flag wird zusätzlich zu fullTemplateTypeCheck hinzugefügt und funktioniert nur in Ivy. Im Vollmodus wird sein:
Überprüfung der Bindung von Komponenten und Anweisungen an @Input
Bei der Überprüfung wird TypScript strictNullChecks überprüft
Überprüfen von Komponententypen und Anweisungen, einschließlich generischer
Überprüfen der Vorlage im Ausführungskontext, z. B. innerhalb von * ngFor
Überprüfen des Ereignistyps $ event in Komponenten und Anweisungen, auch beim Animieren
Überprüfen Sie die korrekten Typen auf lokale Verweise auf DOM-Elemente, z. B. wenn document.createElement ein Tag zurückgibt
Bei einer derart strengen Typprüfung in Vorlagen ist es manchmal erforderlich, diese Prüfung zu deaktivieren. Daher haben wir uns $ any () ausgedacht, bei der die Prüfung nicht durchgeführt wird.
Beispiel: {{$ any (person) .addresss.street}}
@ContentChildren
ContentChild funktioniert standardmäßig nur mit direkten untergeordneten Elementen
<comp> <div #bar> <!-- new runtime --> <div #foo></div> <!-- matches in old runtime --> </div> </comp>
Dazu müssen Sie die Flaggen- Nachkommen abschneiden
@ ContentChildren ('foo', { descendants : false}) foos: QueryList < ElementRef >
DI
Alle Klassen, die Angular DI verwenden, müssen über einen Angular-Dekorator verfügen, z. B. @Directive() oder @Injectable (zuvor nicht dekorierte Klassen waren nur im AOT-Modus oder bei Verwendung über @Injectable zulässig). Standardmäßig sollte die CLI ein korrektes Upgrade durchführen.
An:
export class MyService {...} export class MyOtherService {...} export class MyThirdClass {...} export class MyFourthClass {...} export class MyFifthClass {...} @NgModule({ providers: [ MyService, {provide: SOME_TOKEN, useClass: MyOtherService},
Nachher:
@Injectable() export class MyService {...} @Injectable() export class MyOtherService {...} export class MyThirdClass {...} export class MyFourthClass {...} export class MySixthClass {...}
An:
{provide: MyToken}
Nachher:
{provide: MyToken, useValue: undefined}
Eingaben für Direktiven (z. B. Name in <my-comp name = “”>) werden jetzt beim Erstellen einer Ansicht vor der Änderungserkennung festgelegt (zuvor wurden sie alle während der Änderungserkennung festgelegt).
Einige interessanter
Eigenschaften wie host in @Component und @Directive können übernommen werden (zuvor wurden nur Eigenschaften mit expliziten Feldern wie @HostBinding übernommen).
HammerJS-Unterstützung wird durch den HammerModule-Import bereitgestellt (zuvor war dies immer in Arbeitspaketen enthalten, unabhängig davon, ob die Anwendung HammerJS verwendet hat).
Wenn einem Token das @Host oder @Self injiziert wird, @Host der @Host nicht nach diesem Token (zuvor wurden Token, die mit diesen Flags markiert sind, weiterhin auf Modulebene gesucht).
Beim Zugriff auf mehrere lokale Links in der Vorlage mit demselben Namen wird der erste genommen (die letzte Instanz wurde früher genommen).
Anweisungen, die im exportierten Modul verwendet werden (aber nicht von selbst exportiert werden), werden öffentlich exportiert (zuvor hat der Compiler den privaten Export automatisch mit einem Alias aufgezeichnet, damit er sein globales Wissen zur Lösung von Konflikten verwenden kann).
Externe Funktionen oder externe Konstanten in Decorator-Metadaten können nicht statisch aufgelöst werden (zuvor konnten Sie eine Konstante oder Funktion aus einem anderen kompilierten Modul, z. B. aus einer Bibliothek, importieren und diese Konstante / Funktion in Ihrer @NgModule Definition verwenden).
Verweise auf direkte Eingaben in Anweisungen, auf die über lokale Links zugegriffen werden kann, werden standardmäßig nicht mehr unterstützt.
Wenn es ein nicht verbundenes Klassenattribut und eine Bindung über [Klasse] gibt, werden auch die Klassen des nicht verbundenen Attributs hinzugefügt (zuvor hat die Bindung durch die Klasse Klassen im ungebundenen Attribut umgeschrieben).
Es ist nicht mehr möglich, Lifecycle-Hooks mit Mocks für Instanzen von Direktiven zu Testzwecken zu überschreiben (ändern Sie dazu Lifecycle-Hooks für die Direktive selbst).
Spezielle Injektionstoken (wie TemplateRef oder ViewContainerRef) geben bei jeder Anforderung eine neue Instanz zurück (zuvor wurden Instanzen durchsucht, wenn sie von ähnlichen Knoten angefordert wurden). Dies betrifft hauptsächlich die Tests, mit denen die Identität dieser Objekte verglichen wird.
Das Parsen auf der Intensivstation erfolgt zur Laufzeit, sodass nur Text, HTML-Tags und Textbinder zulässig sind (zuvor waren Anweisungen auch in Ausdrücken auf der Intensivstation zulässig).
Veraltet
Hier werden wichtige Änderungen an der API vorgestellt, und die bereits veralteten Änderungen werden gelöscht.
Entfernen von veralteten APIs
Und wenn das nicht genug ist, dann gibt es noch ein bisschen mehr .
Nun, wir erwarten die Veröffentlichung von Angular 9 nach den Weihnachtsferien =):
Zu Ihrer Information: Ich habe beschlossen, die Veröffentlichung von #Angular 9.0 bis zum nächsten Jahr beizubehalten, damit wir alle und Sie in den kommenden Wochen eine Auszeit nehmen können. Frohe Feiertage und bis 2020!
Abonnieren Sie außerdem den Kanal im @ngFanatic- Telegramm, in dem weitere Neuigkeiten zu Angular veröffentlicht werden.