Angular 21 (November 2025) und 22 (Juni 2026) vollenden den Weg zum „modernen Angular“: zoneless Apps, OnPush als Standard, stabile Signal Forms und Resources sowie neue DI-APIs (@Service, injectAsync). Unten findest du die wichtigen Änderungen aus dem offiziellen Changelog, jeweils mit Link zur Seite, die sie erklärt.
- Change Detection
- standardmäßig zoneless
- OnPush als Standard
- Formulare
- Signal Forms experimentell
- Signal Forms stabil
- Async-Daten
- resource / httpResource experimentell
- stabil + chain + Status-Params
- DI
- —
@Service(),injectAsync()- Template
- regex, spread, arrow functions, instanceof,
@default never - Kommentare in Tags,
?.→ undefined,@boundary(22.2) - HTTP
- HttpClient ohne Setup
- Fetch als Standard
- Testing
- Vitest als Standard
- getLastFixture, createDirective (22.2)
- UI
- Angular Aria
- Aria ausgereift, WebMCP experimentell
All changes, filterable
Filter by version and type. “Breaking” = what to check when you upgrade.
51 Änderungen
22.2
6 Änderungen- neu @boundary (developer preview)Ein Block, der Rendering-Fehler isoliert: @boundary { … } @error (let e = $error; let reset = $reset) { … }.
- neu TestBed.createDirective()Teste Direktiven ohne manuelle Host-Komponente.
- neu Router: RedirectCommand wird geworfen, withAutoCleanupInjectors stabilDu kannst RedirectCommand aus Guards/Resolvern werfen; Route-Injectoren können automatisch zerstört werden.
- neu Templates können auf private Member zugreifenDie Empfehlung bleibt protected für Template-Member.
- neu viewChild / contentChild mit read: InjectorHol dir den Injector eines Kindelements über eine Query.
- neu Signal Forms: dauerhaft versteckte FelderDazu Verbesserungen für die WebMCP-Integration.
22.1
3 Änderungen22.0
Juni 2026 19 Änderungen- breaking OnPush als StandardKomponenten ohne changeDetection sind OnPush. ng update fügt bei Bedarf Eager hinzu.
- stabil Signal Forms — öffentliche APIform(), [formField], [formRoot], Validatoren, FormValueControl, validateHttp / validateAsync mit debounce, reloadValidation, getError().
- stabil resource / rxResource / httpResourceStabil. Neu: ResourceParamsStatus.IDLE/LOADING, ctx.chain(), SSR-Cache, synchrone Werte in Streams.
- neu @Service()Neuer Decorator für Services, die automatisch in root bereitgestellt werden. Nur inject() (keine DI im Constructor). Optionen: autoProvided, factory.
- neu injectAsync()Lazy geladene Services, mit prefetch: onIdle.
- neu debounced() (experimental)Eine debounced Version eines Signals, wie Resource.
- neu Kommentare in Tags<div // Kommentar class="x">.
- neu @defer (on idle(500))Timeout für idle und ein konfigurierbarer Idle-Service (provideIdleServiceWith).
- neu TestBed.getLastFixture()Die zuletzt erzeugte Fixture.
- neu WebMCP (experimental)provideExperimentalWebMcpTools / declareExperimentalWebMcpTool — die App stellt Tools für KI-Agenten im Browser bereit; Signal Forms können automatisch bereitgestellt werden.
- breaking Fetch als Standard-HTTP-BackendwithFetch() ist deprecated. Für den Upload-Fortschritt: withXhr(). reportProgress → reportUploadProgress / reportDownloadProgress.
- breaking paramsInheritanceStrategy: "always"Child-Routen erben Params und Data von allen Eltern-Routen.
- breaking ?. liefert in Templates undefinedWie in TypeScript. Die Diagnosen nullishCoalescingNotNullable / optionalChainNotNullable können auftauchen.
- breaking TypeScript 6, kein Node 20TypeScript < 6 wird nicht mehr unterstützt.
- breaking Removed: ComponentFactoryResolver, ComponentFactory, createNgModuleRef, provideRoutes, Hammer.jsVerwende die Klasse direkt in createComponent, createNgModule, provideRouter.
- breaking Strengerer CompilerFehler bei doppelt gebundenen Inputs/Outputs und bei mehreren passenden Selektoren; data-*-Attribute binden keine Inputs mehr.
- breaking min/max in Signal Forms nur numerischSie akzeptieren keine Strings mehr.
- breaking CanMatchFn: currentSnapshot ist PflichtKlassen-Implementierungen von CanMatch müssen ein drittes Argument akzeptieren.
- neu Inkrementelle Hydration standardmäßigwithIncrementalHydration() ist bei SSR nicht mehr nötig.
21.2
6 Änderungen- neu Arrow Functions und instanceof in Templatesitems().filter(i => i.ok), err instanceof HttpErrorResponse.
- neu @default never; — exhaustiver SwitchEin vergessener Case in einem Union wird zum Compilerfehler.
- neu ChangeDetectionStrategy.EagerAlias für Default, Vorbereitung auf OnPush als Standard in v22.
- neu Resource-Snapshotsresource.snapshot() und resourceFromSnapshots() zum Zusammensetzen von Resources.
- neu Signal Forms: FormRoot, parse errors, SignalFormControlDie Direktive [formRoot], Parse-Fehler für native Inputs, Kompatibilität mit Reactive Forms.
- neu ngTemplateOutlet mit „outlet“-Injector[ngTemplateOutletInjector]="'outlet'".
21.1
4 Änderungen- neu @switch mit mehreren Cases@case (a) @case (b) { … } — derselbe Block für mehrere Werte.
- neu Spread in Templates[...a, ...b], { ...obj }, fn(...args).
- neu Fokus auf ein Signal-Forms-Feldfield().focus() setzt den Fokus auf das gebundene Control.
- neu Router: Scroll, Cleanup, isActive als SignalScroll-Steuerung bei der Navigation, eine isActive()-Funktion, die ein Signal zurückgibt, Wildcards mit Segmenten.
21.0
November 2025 13 Änderungen- neu Standardmäßig zonelessNeue Apps enthalten kein zone.js mehr. Change Detection wird durch Signals, Events und markForCheck ausgelöst.
- neu Signal Forms (experimental)form(), [field] / [formField], schemabasierte Validierung, debounce(). Wird in v22 zur öffentlichen API.
- neu Vitest als Standard-Runnerng test nutzt Vitest über @angular/build:unit-test. Karma ist deprecated.
- neu Angular AriaHeadless, barrierefreie Direktiven: Accordion, Combobox, Grid, Listbox, Menu, Tabs, Toolbar, Tree.
- neu HttpClient ohne SetupHTTP-Services werden in root bereitgestellt; provideHttpClient() brauchst du nur noch zur Konfiguration.
- neu Regex in TemplatesDu kannst /^\d+$/.test(x) direkt in Ausdrücken schreiben.
- neu Generisches SimpleChangesngOnChanges(changes: SimpleChanges<MyCmp>) — typisierte Keys.
- neu IntersectionObserver-Optionen in @defer@defer (on viewport({ rootMargin: "200px" })).
- neu Migrationen ngClass → class, ngStyle → styleng g @angular/core:ngclass-to-class und ngstyle-to-style.
- breaking Type-Checking für Host-Bindings ist standardmäßig aktivVersteckte Typfehler in host: {} können beim Build auftauchen. Lässt sich vorübergehend mit typeCheckHostBindings: false abschalten.
- breaking TypeScript ≥ 5.9Ältere TypeScript-Versionen werden nicht mehr unterstützt.
- breaking lastSuccessfulNavigation ist ein Signalrouter.lastSuccessfulNavigation() muss aufgerufen werden.
- breaking Entfernt: moduleId, benutzerdefinierte Interpolation, NgModuleFactoryAlte Metadata-Optionen wurden aus der API entfernt.
So upgradest du
# Schritt für Schritt upgraden (keine Major-Versionen überspringen)
ng update @angular/core@21 @angular/cli@21
ng update @angular/core@22 @angular/cli@22
# Interaktiver Leitfaden mit allen Schritten für deine Versionskombination:
# https://angular.dev/update-guide
# Was ng update bei v22 automatisch erledigt:
# - fügt ChangeDetectionStrategy.Eager hinzu, wo changeDetection nicht gesetzt war
# - behält HttpXhrBackend, wo es gebraucht wird (withXhr)
# - ergänzt currentSnapshot in CanMatch
# - deaktiviert vorübergehend die neuen Diagnosen für ?. und ??
# - aktiviert strictTemplates in der tsconfigEmpfohlene Reihenfolge nach dem Upgrade
- Build und Tests grün, mit automatisch ergänztem
Eager. - Stelle den Zustand Feature für Feature auf Signals um (Signals, Resource).
- Entferne
Eageraus migrierten Komponenten und prüfe das Ergebnis (Change Detection). - Schreibe neue Formulare direkt in Signal Forms; alte bleiben bei Reactive, bis du einen Grund hast, sie umzuziehen.