VVersions.dev

Angular 18 → Angular 22

Angular 18 is end-of-life (LTS ended November 21, 2025), so move to a supported release. Angular does not allow skipping majors, so go 18 → 19 → 20 → 21 → 22, running ng update once per major. The CLI handles most mechanical work; the headline gains are stable signal reactivity (v20), zoneless change detection and stable Signal Forms (v22), and a Vitest-based test runner.

Version upgradeDifficulty: moderateEffort: 1–4 days for a typical app (four majors)medium risk

Last verified · Updated May 22, 2026

Angular 18 reached end-of-life when its LTS ended November 21, 2025, so upgrade promptly. Reaching Angular 22 (current) means four ng update hops — 18 → 19 → 20 → 21 → 22 — because Angular upgrades one major at a time. The CLI's schematics rewrite most affected code per major; the notable maturations along the way are full signal reactivity becoming stable in v20 and zoneless change detection plus Signal Forms becoming stable in v22.

⛔ Angular 18 is end-of-life

Angular 18's 12-month LTS ended November 21, 2025 — no further security patches. Treat this upgrade as a security obligation and land on a supported major (22, or 21/20 LTS).

Upgrade one major at a time

Angular's policy is to upgrade a single major version at a time, and ng update only runs when the target is within one major of the installed version. Run 18 → 19 first, verify and commit, then 19 → 20, 20 → 21, and 21 → 22. Each ng update applies that major's schematics, so jumping directly skips migrations the CLI would otherwise run.

What changed across 18 → 22

  • Angular 19: standalone components become the default; linkedSignal() and the resource() async API arrive; incremental hydration lands.
  • Angular 20: effect(), linkedSignal(), and toSignal() are declared stable (full signal reactivity); zoneless change detection enters developer preview; httpResource() matures.
  • Angular 21: zone.js is no longer bundled in new apps by default; Signal Forms ship experimentally; Vitest becomes the default test runner; Angular Aria enters developer preview.
  • Angular 22: zoneless change detection and Signal Forms are stable; OnPush is the default change-detection strategy for new components; Angular Aria is stable.

Four ng update hops from 18 to 22

# Upgrade one major at a time — never skip
ng update @angular/core@19 @angular/cli@19
# verify, commit, then:
ng update @angular/core@20 @angular/cli@20
ng update @angular/core@21 @angular/cli@21
ng update @angular/core@22 @angular/cli@22

# Optional, in separate commits: adopt newer APIs
ng generate @angular/core:control-flow              # if not already on @if/@for
ng generate @angular/core:signal-input-migration    # convert @Input to input()

Angular 18 vs 22

ConcernAngular 18Angular 22
Component modelStandalone availableStandalone default; selectorless on the horizon
Change detectionZone.js + Zone-based CDZoneless stable; OnPush default for new components
Signal reactivitysignal() stable; effect/linkedSignal in previewFull signal reactivity stable (since v20)
FormsReactive / template-drivenSignal Forms stable (plus classic forms)
Test runnerKarma / JasmineVitest default (since v21)
HydrationFull hydrationIncremental hydration

ℹ Let ng update do the mechanical work

Modern Angular's ng update runs schematics that rewrite most affected code for each major. Run it per major, review the diff, and only hand-edit what the CLI flags. Adopt larger opt-in migrations (control flow, signal/zoneless) in separate commits from the version bumps.

AI-assisted upgrade workflow

Upgrade this app from Angular 18 to 22 one major at a time. For each step run `ng update @angular/core@<next> @angular/cli@<next>` (19, then 20, 21, 22), review the schematic changes, fix any flagged code, then run ng build, ng lint, and ng test before continuing. Treat zoneless change detection and Signal Forms as opt-in: only adopt them in separate commits after reaching 22. Report results after each major and never skip a version.

Safety: Run ng update one major at a time (18→19→20→21→22). Commit and verify after each major; do not adopt zoneless, Signal Forms, or control-flow/signal schematics in the same commit as a version bump.

PR review checklist

  • @angular/core and @angular/cli are on the same 22.x version
  • ng update was run per major (18→19→20→21→22), not skipped
  • Schematic-applied changes were reviewed, not blindly accepted
  • Third-party Angular libraries resolve to Angular 22-compatible versions
  • Zoneless / Signal Forms adoption (if any) is in its own commit, separate from version bumps
  • ng build and ng test pass with no new warnings

Rollback strategy

  • Keep each ng update major in its own commit so a single major can be reverted.
  • Restore package.json and the lockfile and reinstall to revert a bump.
  • Hold the upgrade behind a release branch until the full test suite is green.

Official sources

Copy-ready AI prompts

Structured prompts for an AI coding assistant. Inspect first, then execute incrementally, and keep a human in the review loop.

Repo inspection: Repo inspection prompt

You are helping migrate an Angular codebase from Angular 18 to Angular 22.

Do not edit files yet. First inspect the repository and report:
1. The exact @angular/core and @angular/cli versions in package.json and the lockfile (or the angular.js version for AngularJS apps).
2. The architecture: NgModules vs standalone components, the router in use ($routeProvider, ui-router, or @angular/router), and any $scope/controller code still present.
3. Components, services, and directives grouped by complexity so a migration order can be planned.
4. Third-party libraries and whether they have versions compatible with the target.
5. Build, lint, and test commands (ng build, ng test, ng lint, or the legacy toolchain).

Return: a migration risk summary, the modules/components most likely to break, a suggested incremental order, the commands to run before editing, and any questions that need human confirmation.

Safety: Inspection only. The agent must not modify files in this step.

Works with Claude Code, Cursor, GitHub Copilot.

Migration execution: Migration execution prompt

Migrate this codebase from Angular 18 to Angular 22, one component or concern at a time.

Work incrementally and pause for review after each unit: stand up the hybrid/bridge layer first, then migrate the lowest-risk leaf component, rewrite its template and state, wire it back into the host app, and verify it renders identically before moving on. Convert services and routing only after the components that depend on them are migrated.

After each step run the project's build, lint, and tests, and report results before continuing. Do not refactor unrelated code or bundle multiple components into one change.

Safety: Apply changes incrementally and keep each step reviewable. Never bundle unrelated refactors or migrate multiple components at once.

Works with Claude Code, Cursor, GitHub Copilot.

Test plan

Commands

  • ng build
  • ng lint
  • ng test --watch=false
  • npx playwright test

Manual checks

  • Render key views and confirm no template errors after each major's schematics.
  • SSR: load server-rendered pages and confirm incremental hydration completes with no console warnings.
  • If you adopt zoneless, exercise async flows that previously relied on Zone.js to confirm change detection still fires.
  • Verify third-party Angular libraries load on Angular 22.

Regression risks

  • Skipping a major and missing the schematics ng update would have applied.
  • Third-party libraries not yet compatible with Angular 22.
  • Change-detection gaps after switching to zoneless where code relied on Zone.js patching.
  • Hydration mismatches after incremental hydration is enabled.

Acceptance criteria

  • @angular/core and @angular/cli are on Angular 22 with matching versions.
  • ng build, lint, unit, and e2e tests pass.
  • No new Angular compiler or hydration warnings.

Frequently asked questions

Can I jump straight from Angular 18 to 22?

No. Angular supports upgrading one major at a time, and ng update only moves within a single major per run. Go 18 → 19 → 20 → 21 → 22, verifying after each. Each step runs the schematics for that major, so skipping a version skips migrations the CLI would otherwise apply.

Do I have to adopt zoneless change detection or Signal Forms?

Not immediately. Both are stable in Angular 22 but opt-in. Zone-based change detection and the classic reactive/template-driven forms still work. Adopt zoneless (provideZonelessChangeDetection) and Signal Forms after you reach 22, in separate commits, once the version upgrade is green.