Angular 17 に間に合うように –Ignite UI 17.0.0 です!

Angular 17 に間に合うように –Ignite UI 17.0.0 です!

Angular 17 には、まったく新しいブランディング、新しい Web サイト、学習リソースなどが用意されています。しかし、17.0.0もIgnite UIしています。そこで新機能をご覧ください。

7min read

Angular 17はここにあり、多くの人がそれをAngularルネッサンスと呼んでいます!新機能、新しいブランディング、新しいウェブサイト、新しい未来を見据えたアイデンティティなど、これらのエキサイティングなことが、このアルバムを本当に特別なリリースにしています。また、Angular 17 に間に合うように、17.0.0 もIgnite UIします。

Try Ignite UI for Angular

しかし、何が盛り上がっているのでしょうか? そこで何が新しくなったのかを垣間見てみましょう。

  • ​Angular.devでは、書き直された学習の旅、より優れたドキュメント、チュートリアルにより、誰もが自分のペースで学習を開始し、以前よりもはるかに簡単にプロジェクトでフレームワークを使用できるようになりました。
  • 新しい組み込み制御フローは、開発者が *ngIf、*ngSwitch、*ngFor に取り組み、「組み込みの制御フロー ループで最大 90% 高速なランタイム」を達成するのを支援することを目的としています。
  • 「前例のない人間工学」による宣言型で強力な遅延読み込みを可能にする新しい遅延ビューにより、Angularがこれまで以上に速く、パフォーマンスが向上します。
  • ハイドレーション、ハイブリッドレンダリングのサポート、SSRなど、開発者の体験とアプリのパフォーマンスの両方を向上させます。
  • Vite と esbuild は、新しいプロジェクトに対してデフォルトで有効になりました。
  • さらに、Angular 17 リリース ブログ –Introducing Angular v17で詳しく説明されているその他の事項 

GoogleのAngular担当プロダクト&DevRelリーダーであるMinko Gechev氏は次のように指摘しています。「Angularのルネッサンスは、過去数回のバージョンで全速力で進んでいます。シグナルベースの反応性、ハイドレーション、スタンドアロンコンポーネント、ディレクティブ構成、その他多数の機能などの改善により、勢いを増しています。」

これをIgnite UI for Angularチームの活動と比較すると、中央値で7日以内に、Angular、13のメジャーバージョンの新機能すべてに追いつくのに7年間かかります。これはすべて、私たちがイノベーションの最前線に立ち続けることにコミットしているからです。そして今、Angular 17リリースのすぐ後に、フレームワークの最新かつ最もエキサイティングなアップデートと互換性のある改善されたIgnite UI for Angularライブラリを使用して、開発プロセスを強化できます。

Angular VersionRelease dateIgnite UI for AngularRelease dateTurnaround time in days
4.0.013-Dec-164.0.018-April-17126
5.0.01-Nov-175.0.03-Nov-172
6.0.04-May-186.0.021-May-1817
7.0.018-Oct-187.0.026-Nov-1839
8.0.028-May-198.0.019-Jun-1922
9.0.06-Feb-209.0.011-Feb-205
10.0.024-Jun-2010.0.025-Jun-201
11.0.011-Nov-2011.0.013-Nov-202
12.0.012-May-2112.0.014-May-212
13.0.04-Nov-2113.0.023-Nov-2119
14.0.02-Jun-2214.0.09-Jun-227
15.0.016-Nov-2215.0.023-Nov-227
16.0.03-May-2316.0.015-May-2312
17.0.08-Nov-2317.0.09-Nov-231

最新のAngularリリースに一致するまでの所要時間の中央値はIgnite UI for Angular 7日です。

Ignite UI for Angular 17.0.0 の新機能

Angular 17 compatibility

Improved tree-shaking capability

バージョン 16.1.0 以降、製品のツリー シェイキング機能の改善に取り組んできました。以下の変更を行いました。

  • アニメーション: 新しいエントリポイントから 'igniteui-angular/animations' の下にエクスポートされるようになりました。未使用のアニメーションは、製品と一緒にバンドルされなくなります。
  • ローカライゼーション: 特定のコンポーネントを使用するかどうかに関係なく、すべてのデフォルトのローカライゼーションリソースを取得することはできなくなります。文字列は、アプリケーションで使用するコンポーネントに対してのみ取得されます。
  • 試用版のウォーターマーク: 試用版のウォーターマークが使用されていない場合でも、ライセンス パッケージを使用すると、バンドルに試用版のウォーターマークが表示されなくなります。
  • マテリアルアイコンの拡張:バンドルに未使用のアイコンは含まれなくなります。

公式スタンドアロンコンポーネント

スタンドアロン コンポーネントのサポートはプレビュー終了になりました。すべての igniteui-angular コンポーネントは、スタンドアロン コンポーネントとしてエクスポートされます。各コンポーネントには、ユーティリティディレクティブ配列もあります。スタンドアロンコンポーネントの詳細については、こちらの記事をご覧ください。

Complete Ignite UI for Angular 17.0.0 変更ログ

主な変更点は以下の通りです。

  • `IgxCard`
  • **破壊的変更** 'type' 属性は非推奨となり、将来のバージョンで削除される予定です。カード コンポーネントの既定のビューが "アウトライン" になりました。ユーザーは、新しく作成した「昇格」プロパティをカードに追加することで、「昇格」ビューに切り替えることができます。
  • 「スタンドアロンコンポーネント」のサポートが正式に開始されました
  • added `IGX_RADIO_GROUP_DIRECTIVES` for `IgxRadioGroupDirective` and `IgxRadioComponent`
  • 'animations' が 'igniteui-angular/animations'/'@infragistics/igniteui-angular/animations' からインポートされるようになりました。
  • 製品のツリーシェイキングが改善されました
  • 'igniteui-angular-i18n' が tree-shakeable になりました
  • 'igniteui-angular/animations' が tree-shake 可能になりました
  • 「igniteui-angular」コンポーネントがツリーシェイクを改善しました
  • **破壊的変更** 'getCurrentResourceStrings' が削除されました。代わりに、特定のコンポーネント文字列のインポートを使用してください。
  • 例えば、EN 文字列は 'igniteui-angular' から来ます: 'import { GridResourceStringsEN } from 'igniteui-angular';'
  • たとえば、DE またはその他の言語の文字列は 'igniteui-angular-i18n' から来ます: 'import { GridResourceStringsDE } from 'igniteui-angular-i18n';'
  • DisplayDensity トークンと入力は非推奨となり、'–ig-size' テーマが優先されます
  • 現在、ライブラリのサイズを小さくする作業を行っています
  • 「IgxRadioComponent」のサイズが半分に縮小されました
  • 「IgxSwitchComponent」のサイズが半分に縮小されました
  • `IgxRadioComponent`
  • **重大な変更** 'IChangeRadioEventArgs' は 'IChangeCheckboxEventArgs' になりました。「ng update」を「17.0.0」に変更すると、これが自動的に移行されます。
  • **重大な変更** 'RadioLabelPosition' は 'LabelPosition' になりました。「ng update」を「17.0.0」に変更すると、これが自動的に移行されます。
  • `IgxSwitchComponent`
  • **重大な変更** 'IChangeSwitchEventArgs' は 'IChangeCheckboxEventArgs' になりました。「ng update」を「17.0.0」に変更すると、これが自動的に移行されます。
  • **破壊的変更** 'SwitchLabelPosition' は 'LabelPosition' になりました。「ng update」を「17.0.0」に変更すると、これが自動的に移行されます。
  • `IgxCombo`
  • **破壊的変更** 'IComboSelectionChangingEventArgs' プロパティ 'newSelection' と 'oldSelection' は、その機能をより適切に反映するために、それぞれ 'newValue' と 'oldValue' に名前が変更されました。Comboの 'value'と同様に、 'valueKey'が設定されているかどうかに応じて、指定されたプロパティ値または完全なデータアイテムのいずれかを出力します。自動移行が利用可能で、「ng update」に適用されます。
  • 'IComboSelectionChangingEventArgs' は、'valueKey' の影響を受けなくなり、Combo の 'data' からアイテムを一貫して出力する古いプロパティの代わりに、'newSelection' と 'oldSelection' の 2 つの新しいプロパティを公開します。

注: 'valueKey' が設定されたリモート データ シナリオでは、読み込まれたデータ チャンクに現在含まれていない選択されたアイテムには、'valueKey' プロパティを持つ部分的なアイテム データ オブジェクトが出力されます。

  • **重大な変更** – 'IComboSelectionChangingEventArgs' プロパティの 'added' と 'removed' に、'valueKey' が設定されているかどうかに関係なく、常にデータ項目が含まれるようになりました。これにより、更新された 'newSelection' プロパティと 'oldSelection' プロパティに揃えられます (上記と同じリモート データの制限が含まれます)。
  • `IgxSimpleCombo`
  • **重大な変更** – 'ISimpleComboSelectionChangingEventArgs' プロパティの 'newSelection' と 'oldSelection' は、その機能をより適切に反映するために、それぞれ 'newValue' と 'oldValue' に名前が変更されました。Comboの 'value'と同様に、 'valueKey'が設定されているかどうかに応じて、指定されたプロパティ値または完全なデータアイテムのいずれかを出力します。自動移行が利用可能で、「ng update」に適用されます。
  • 'ISimpleComboSelectionChangingEventArgs' は、'valueKey' の影響を受けなくなり、Combo の 'data' からアイテムを一貫して出力する古いプロパティの代わりに、'newSelection' と 'oldSelection' の 2 つの新しいプロパティを公開します。

注: 'valueKey' が設定されたリモート データ シナリオでは、読み込まれたデータ チャンクに現在含まれていない選択されたアイテムには、'valueKey' プロパティを持つ部分的なアイテム データ オブジェクトが出力されます。

  • **破壊的変更** 'value' プロパティと 'selection' プロパティは、配列で囲まれた同じ値またはデータ項目の代わりに 1 つの値またはデータ項目を正しく返し、空の配列の代わりに 'undefined' を返すようになりました。これは、選択イベントから出力される値と一致し、'formControlName'/'ngModel' ディレクティブを操作するときに一致します。
  • `IgxCombo`,`IgxSimpleCombo`
  • **破壊的変更** 'displayValue' プロパティは、(配列に値を表示する代わりに) 期待どおりに表示テキストを返すようになりました。

すべてを包み込むために...

互換性のためにシームレスに作成されたIgnite UI for Angularは、最新のテクノロジーとメジャー リリースの力を活用できるライブラリです。最高のAngular UIツールキットと関連する洞察を提供することに尽力し、私たちの目標は、より多くのノウハウ、新機能、パフォーマンスの向上、安定性の向上を提供することです。一部の拡張機能は、Ignite UI for Angular GitHubリポジトリを通じて、あなたのようなユーザーからのリクエストのおかげで追加されました。このことを念頭に置いて、私たちは常に提案やフィードバックを受け入れています - それは私たちを成長させ、あなたの開発ニーズによりよく対応します。

詳細については、以下をご覧ください。

さらに

​MediumでIgnite UI for Angularをフォローして、最新の情報を入手し、取り組んでいる最新のAngular関連プロジェクトについて学びましょう。GitHub でスターを付けて、問題セクションの懸念事項、質問、または機能リクエストに対処することで、製品を継続的に改善するのを手伝ってください。

Ignite UI for Angular

Angular
デモを予約