Angular v22.2.2

30秒で判断

• 対応すべき人: Angular 22系を利用しており、::ng-deepや@let宣言、ネストした<ng-template>を使っている、またはcompilerの挙動に不審な点を感じている方。
• 対応不要な人: Angularを使用していない方、22系で特に不具合に遭遇していない方。
• 確認コマンド: ng version（または cat node_modules/@angular/core/package.json | grep '"version"'）で現在のバージョンを確認。

この変更が意味すること

Angular 22.2.2 は、compilerを中心としたバグ修正のみを含むパッチリリースです。新機能の追加や破壊的変更はなく、22系の安定性を高める内容です。

主な変更点

::ng-deep検出状態のリーク修正

ルール間で::ng-deepの検出状態が意図せずリークしていた不具合が修正されました（fa63bfad14）。

エンティティ解決時のprototypeルックアップ回避

エンティティ解決時に不要なprototypeルックアップが発生していた問題を修正しました（5744e7575c）。

ネストした<ng-template>でのディレクティブマッチ修正

さまざまな名前空間にネストされた<ng-template>に対して、ディレクティブが正しくマッチしない不具合が修正されました（97e57157e4）。

@let宣言関連の診断の調整

コントロールフローのコンテンツプロジェクション診断において、@let宣言を無視するよう調整されました（0474258a5a）。

EOL / サポート状況

20系は2026年11月28日にEOLを迎えます。20系を利用中の場合は21/22系への移行計画を進めてください。

開発者への影響

1. ::ng-deepやネストした<ng-template>を使っている場合、意図しないスタイル適用やディレクティブ未適用の問題が解消されます。
2. @let宣言を使うテンプレートで診断の誤検知が出ていた場合、今回の修正で解消される可能性があります。
3. 破壊的変更はないため、22系内でのアップデート負荷は小さい見込みです。

アップデート方法

ng update @angular/core@22.2.2 @angular/cli@22.2.2

# バージョン確認
ng version

アップデート後は、::ng-deepやネストしたテンプレートを含む画面の見た目・挙動をテスト環境で確認してから本番へ適用してください。

データソース: GitHub Releases API, endoflife.date, npm Registry AI解説は Claude API により自動生成されています。正確性については原文をご確認ください。

export const impactScoreData = {
  "total": 18,
  "level": "low",
  "label": "影響度: 低（バグ修正中心のパッチ）",
  "factors": [
    {"name": "Breaking Changes", "score": 0, "maxScore": 40},
    {"name": "新機能", "score": 0, "maxScore": 25},
    {"name": "バグ修正", "score": 12, "maxScore": 20},
    {"name": "セキュリティ", "score": 0, "maxScore": 15},
    {"name": "依存関係", "score": 6, "maxScore": 15}
  ]
};

export const eolData = [
  {"range": "22", "status": "active", "eolDate": "2028-06-30"},
  {"range": "21", "status": "active", "eolDate": "2027-06-30"},
  {"range": "20", "status": "active", "eolDate": "2026-11-28"},
  {"range": "19", "status": "eol", "eolDate": "2026-05-19"},
  {"range": "18", "status": "eol", "eolDate": "2025-11-21"}
];

export const breakingChangesData = {
  "count": 0,
  "items": []
};

export const updateAdviceData = {
  "rating": 2,
  "maxRating": 5,
  "label": "通常のメンテナンスサイクルでの更新で可",
  "shouldUpdate": [
    "::ng-deepやネストしたng-templateを利用している",
    "compilerの挙動に不審な点を感じている"
  ],
  "canWait": [
    "Angularを使用していない",
    "22系で特に不具合に遭遇していない"
  ]
};

export const versionNavData = {
  "previousVersion": "22.2.1",
  "nextVersion": null
};

export const actionGuideData = {
  "evaluation": {
    "priority": "low",
    "actionRequired": "optional"
  },
  "action": {
    "steps": [
      "テスト環境で22.2.2へ更新する（ng update）",
      "::ng-deep・ネストしたテンプレートの表示を確認する",
      "本番環境に適用する"
    ],
    "skipIf": [
      "Angularを使用していない",
      "22系で特に不具合に遭遇していない",
      "すでに22.2.2以降を利用している"
    ],
    "notes": ["破壊的変更はないため、通常のメンテナンスで更新して問題ありません"]
  },
  "impact": {
    "targets": ["Angular 22利用者"],
    "scope": "minimal"
  },
  "changeCategory": "バグ修正"
};