Angular 22: The Signal-First Era Becomes the Default

Angular 22, released in June 2026, is easy to underrate at a glance because it doesn’t ship one shiny headline feature. Look closer, though, and it’s one of the most consequential releases in years: it’s the version where Angular’s long, deliberate investment in signals stops being something to “watch but wait on” and becomes the default, stable, recommended way to build. The reactive, signal-first direction the team has been pointing at for three years is, as of v22, simply how Angular works now.

If you’ve been holding off on adopting signals because half the pieces were experimental, that excuse is gone. Let’s walk through the whole picture.

The headline: experimental becomes stable

Three significant APIs graduated to production-ready, and together they form a complete reactive foundation.

Signal Forms are stable. This is the new forms API, and it folds together the best parts of what came before: the structure of reactive forms, the strong typing teams wanted, the ergonomics of template-driven forms, and the reactivity of signals. Alongside it, v22 ships a Submission API, dynamic schemas, and interop with the existing Reactive Forms, so you can build production forms on signals without an experimental warning hanging over them, and migrate gradually instead of all at once.

The Resource API is stable. resource, rxResource, and httpResource give you reactive asynchronous data that lives inside the signal graph, so loading remote data stops being a separate world of subscriptions and becomes just another reactive value:

import { httpResource } from "@angular/common/http";
import { Component, input } from "@angular/core";
 
@Component({ /* ... */ })
export class UserCard {
  userId = input.required<string>();
 
  // Re-fetches automatically whenever userId() changes, and exposes
  // the data, loading, and error states as signals you read in the template.
  user = httpResource(() => `/api/users/${this.userId()}`);
}

No manual subscription, no async pipe juggling, no teardown to forget. The request reacts to its inputs and the result is a signal like everything else.

Angular Aria is generally available. The accessibility package introduced as a preview is now production-ready and integrated with Signal Forms, which means accessible components are a first-class, supported concern rather than a bolt-on.

OnPush is now the default

This is the change that quietly touches every new component you write. Previously, components defaulted to the eager change detection strategy; in v22, new components default to OnPush. The old behavior was renamed “Eager” for clarity, and an automatic migration adds the explicit Eager strategy to your existing components so nothing breaks on upgrade.

The practical effect is that new code gets high-performance change detection for free, which nudges the whole ecosystem toward the signal-based patterns that make OnPush effortless. It’s a small flag with a big philosophical message: performance-first is no longer something you opt into. Two more defaults moved in the same spirit, with incremental hydration now on by default and the HTTP client using the Fetch API out of the box.

Ergonomics that cut the boilerplate

Beyond the big stabilizations, v22 is full of quality-of-life refinements that show a team sweating the details.

The new @Service decorator is a good example. By default it behaves exactly like @Injectable({ providedIn: "root" }), a tree-shakeable, app-wide singleton, but without the repeated configuration object:

@Service()
export class CartService {
  // Root-provided singleton by default. No options object needed.
}

The reasoning is sound: the overwhelmingly common case is a root singleton, so that should be the default rather than something you spell out every time. And the name describes what the class is, not the mechanism behind it. @Injectable isn’t going anywhere, but for a typical service, @Service() is the more direct choice.

Paired with that, injectAsync brings first-class asynchronous dependency injection with on-idle prefetching, so you can lazily load heavy services and defer their cost until they’re actually needed, a real lever for startup performance and bundle size. There’s also a new debounced helper, comment support inside element attribute declarations for documenting gnarly templates, and a batch of router improvements. Worth flagging on that last point: paramsInheritanceStrategy now defaults to always, which is a behavioral change to verify if you rely on nested route params.

Angular’s genuine turn toward AI

The most forward-looking part of v22 is its AI agent story, and it’s worth understanding because it’s a real architectural direction, not a marketing line.

The Angular MCP server tooling graduated to stable, and the team introduced Angular Agent Skills, installable with npx skills add, which hand coding assistants up-to-date, framework-specific guidance so they generate modern, correct Angular instead of patterns from stale training data. In development, Angular now exposes a signal graph and a dependency injection graph as debugging tools surfaced in DevTools, which are genuinely useful for understanding reactive flows.

There’s also an early, experimental piece: support for WebMCP, a proposed standard that lets a web page expose Model Context Protocol capabilities directly, so an agent can use your running app as a tool. A new declareExperimentalWebMcpTool() function exists for this. The honest framing is that the MCP tooling and skills are useful today, while WebMCP is a flagged experiment to prototype with, not to ship.

The upgrade reality check

A maturity release still has sharp edges, and the responsible move is to know them before you run ng update.

The toolchain floor went up: v22 requires TypeScript 6 and drops 5.9, drops Node 20, and adds Node 26 support. The CLI automates most of the migration, but a few things deserve manual attention, the new OnPush and paramsInheritanceStrategy defaults chief among them. On testing, the ecosystem is steering toward Vitest, with migrate-karma-to-vitest and refactor-jasmine-vitest migrations available to move off Karma at your own pace.

One underrated reason to upgrade promptly: v22 is also a serious security release, with a wave of SSRF protections and stricter sanitization across platform-server and HttpClient. For any enterprise or SSR deployment, that alone justifies the bump.

A sensible adoption path looks like this:

• Upgrade the framework now:

Run ng update, let the automatic migrations preserve your current behavior, and stay on a supported version.

• Adopt the stable APIs deliberately:

Move new forms to Signal Forms and new async data to the Resource API over the next few sprints, rather than rewriting everything at once.

• Lean into signals and OnPush:

Since they’re now the default direction, writing new components the signal-first way is the path of least resistance and the most future-proof.

• Keep the experimental AI features on a prototype branch:

Use the stable MCP tooling and skills freely, but treat WebMCP as the experiment it is.

Wrapping up

Angular 22 is a maturity release, and that’s a compliment. It prioritizes stability over spectacle, taking three years of work on signals, reactivity, and accessibility and turning it from a collection of experiments into the everyday, supported reality of building Angular apps. Signal Forms are stable, the Resource API is stable, OnPush is the default, and accessibility is first-class.

The signal-first future Angular kept promising isn’t a future anymore. In v22, it’s just Angular, and that’s exactly the kind of boring, dependable progress you want from the framework running your most important applications.