Skip to content

feat(angular): support Angular 22#31205

Merged
ShaneK merged 9 commits into
major-9.0from
feat/ng22
Jun 11, 2026
Merged

feat(angular): support Angular 22#31205
ShaneK merged 9 commits into
major-9.0from
feat/ng22

Conversation

@ShaneK

@ShaneK ShaneK commented Jun 10, 2026

Copy link
Copy Markdown
Member

Issue number: resolves #31204


What is the current behavior?

Currently, @ionic/angular on major-9.0 supports Angular 18 through 21 and TypeScript 5.4 through 5.9. The library and @ionic/angular-server don't build under Angular 22 / ng-packagr 22 / TypeScript 6.0. TS 6.0 surfaces latent tsconfig problems (a baseUrl the schematics build relied on, and types now defaulting to []), and Angular 22's typeCheckHostBindings rejects the $event.target host bindings in ion-tabs and the multi-element value accessors. The package also still lints with ESLint 8 and the legacy .eslintrc.json

What is the new behavior?

This extends the supported Angular range to 18 through 22 and upgrades TypeScript to v6.0. A new ng22 test app is added, mirroring ng21 (zoneless), so the automated test matrix covers v18-22 end to end

The package's ESLint setup is migrated to the v9 flat config, which was required by the upgrade to angular-eslint@22

Several shared test pages under test/base/ were modernized to signals (router-link, checkbox, the value-accessor display, and the lazy modal example). Angular 22 defaults components without an explicit strategy to OnPush, so plain-field state mutated from an Ionic lifecycle hook no longer re-renders on its own in the test app

Does this introduce a breaking change?

  • Yes
  • No

Apps moving to Angular 22 inherit three Angular 22 requirements, all documented in BREAKING.md: components without an explicit change detection strategy default to OnPush (run ng update to migrate to eager, or use a signal / markForCheck() for state set in lifecycle hooks), TypeScript 6.0 or later is required, and the minimum Node.js version rises to ^22.22.3 || ^24.15.0 || ^26.0.0. Angular 18 through 21 are unaffected

Other information

Angular 22's CLI hard-blocks Node below ^24.15.0 / ^22.22.3 / >=26, so local ng serve / ng test of the ng22 app needs a Node version in that range


Current dev build (2026-06-10):

8.8.9-dev.11781098612.122c6758

Angular 22 test app: https://ionic-framework-git-feat-ng22-ionic1.vercel.app/angular/
Docs PR: ionic-team/ionic-docs#4549
Docs Preview: https://ionic-docs-git-feat-ng22-ionic1.vercel.app/docs/updating/9-0#angular

@ShaneK ShaneK requested a review from a team as a code owner June 10, 2026 13:35
@ShaneK ShaneK requested a review from thetaPC June 10, 2026 13:35
@vercel

vercel Bot commented Jun 10, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
ionic-framework Ready Ready Preview, Comment Jun 11, 2026 5:25pm

Request Review

@github-actions github-actions Bot added the package: angular @ionic/angular package label Jun 10, 2026
@ShaneK ShaneK changed the title feat(angular): support Angular 22 and TypeScript 6.0 feat(angular): support Angular 22 Jun 10, 2026

@brandyscarney brandyscarney left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good 🎉

Comment thread BREAKING.md Outdated
Co-authored-by: Brandy Smith <brandyscarney@users.noreply.github.com>

@thetaPC thetaPC left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM, with minor question

Comment thread packages/angular/tsconfig.schematics.json
@thetaPC

thetaPC commented Jun 11, 2026

Copy link
Copy Markdown
Contributor

Meant to ask if we can add the mode switch like we have in Vue and React. Not a blocker but when possible, it would be great!

@ShaneK

ShaneK commented Jun 11, 2026

Copy link
Copy Markdown
Member Author

@thetaPC Good idea, I forgot about that. Done! https://ionic-framework-git-feat-ng22-ionic1.vercel.app/angular/ (diff f770f88)

@thetaPC thetaPC left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM, thank you!

@ShaneK ShaneK merged commit bd21e00 into major-9.0 Jun 11, 2026
50 checks passed
@ShaneK ShaneK deleted the feat/ng22 branch June 11, 2026 18:00
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

package: angular @ionic/angular package

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants