Improved Switch Statements and Template Error Handling

▶ Watch (2:58)

The switch statement now supports multiple case matching for statuses with identical outputs. Developers can also add a default case with the never keyword to get a compile-time error when a union type changes. That error surfaces during authoring, not at runtime. The change prevents UI code from falling out of sync with evolving TypeScript types. Template inline arrow functions are also allowed for short logic. Mark Thompson assured the audience that calling short functions from templates does not harm change detection.

Signal Forms and Angular Aria Reach Stable

▶ Watch (9:15)

Signal forms combine reactive forms, strongly typed forms, and template-driven forms with signals. Developers define a model with a signal, import the form function, and pass the model in. Built-in validators are available, and custom validation uses a validate function that returns an error object or null. Angular Aria provides 11 fully accessible UI patterns. Customization uses standard CSS. Both signal forms and Angular Aria will be stable in Angular v22, along with async reactivity APIs resource and HttpResource.

Boundary Error Isolation Lands in Developer Preview

▶ Watch (7:34)

The @boundary syntax isolates component crashes that would otherwise blank the entire screen. A fallback UI can be defined. Future capabilities include intentional retry logic when a component fails. The feature enters developer preview in Q3 2026. Thompson demonstrated a checkout flow where a crashed promotional widget no longer prevents the rest of the page from rendering.

Angular MCP Enables Agentic Workflows

▶ Watch (16:40)

Angular MCP provides Model Context Protocol tools for agentic environments. The devServer.waitForBuild tool lets an agent build, inspect output, and adjust next steps. devServer.start and devServer.stop give agents browser control. Additional tools include an AI tutor, a modernize tool, and a migration for OnPush change detection. Running ng mcp generates the configuration. Thompson combined Angular MCP with Chrome DevTools for agents: the agent built the app, started the server, and snapped a screenshot to verify changes.

Vibe Coding with Angular in Gemini Canvas and AI Studio

▶ Watch (24:28)

Gemini Canvas for the web app lets users specify Angular as the technology in a prompt. Thompson generated a snack rotation app for his child’s sports team in one shot. Google AI Studio also supports Angular via a configuration panel. He prompted a math facts flashcard app for a third grader. The result was a single-shot generated application. Users can refine the app in the browser, chat with Gemini to add Firebase, or download the code and continue in an IDE.

Notable Quotes

If you add the default case and use the never keyword, you’ll get something really fantastic, a compile-time error. Mark Thompson · ▶ Watch (4:34)

it gives you a way to isolate the errors in that particular code, so the rest of your component can still work. Mark Thompson · ▶ Watch (8:14)

Angular MCP comes with some special tools already. Mark Thompson · ▶ Watch (16:51)

vibe coding beyond what it means for who gets to code or not. Think about what you get to create. Mark Thompson · ▶ Watch (26:54)

Key Takeaways

  • Angular v22 stabilizes signal forms, Angular Aria, and async reactivity APIs.
  • The @boundary directive prevents component crashes from taking down the whole page.
  • Angular MCP and agent skills let AI agents build, test, and verify Angular apps.