乐胖代购免代理版

Ignite UI for Angularリリースノート

インフラジスティックス・ジャパン株式会社、ローカライゼーションのルミです。Ignite UI for Angular 18.2 リリースいたしました。本リリースでは、様々な新機能と重大な変更が含まれておりますので是非ご期待ください。詳細は以下をご覧ください。

Typedoc と Sass の API サイトで表示するバージョンを選択いただけますが、製品リリースから同バージョンの API ご提供までには通常数日いただいております。また前バージョンリリース以降に API の追加/変更がない場合、最新バージョンはドロップダウンに追加されない場合があることにご注意ください。

はじめに
- Ignite UI for Angular のバージョニング
Ignite UI for Angular 18.2.17 リリースノート
- 新機能
- 不具合修正
Ignite UI for Angular 18.2.16 リリースノート
- 新機能
- 不具合修正
Ignite UI for Angular 18.2.15 リリースノート
- 新機能
- 不具合修正
Ignite UI for Angular 18.2.14 リリースノート
- 新機能
- 不具合修正
Ignite UI for Angular 18.2.13 リリースノート
- 新機能
- 不具合修正
Ignite UI for Angular 18.2.12 リリースノート
- 新機能
- 不具合修正
Ignite UI for Angular 18.2.11 リリースノート
- 新機能
- 不具合修正
Ignite UI for Angular 18.2.10 リリースノート
- 新機能
- 不具合修正
Ignite UI for Angular 18.2.9 リリースノート
- 新機能
- 不具合修正
Ignite UI for Angular 18.2.8 リリースノート
- 新機能
- 不具合修正
Ignite UI for Angular 18.2.7 リリースノート
- 新機能
- 不具合修正
Ignite UI for Angular 18.2.6 リリースノート
- 新機能
- 不具合修正
Ignite UI for Angular 18.2.5 リリースノート
- 新機能
- 不具合修正
Ignite UI for Angular 18.2.4 リリースノート
- 新機能
- 不具合修正
Ignite UI for Angular 18.2.3 リリースノート
- 新機能
- 不具合修正
Ignite UI for Angular 18.2.2 リリースノート
- 新機能
- 不具合修正
Ignite UI for Angular 18.2.1 リリースノート
- 新機能
- 不具合修正
Ignite UI for Angular 18.2.0 リリースノート
一般
新機能
テーマ
- スクロールバー: 新規 CSS 変数
一般
サンプル
Angular API
ナレッジベース

はじめに

Ignite UI for Angular は、50 種類以上のマテリアルデザインに対応する Angular 対応コンポーネントです。モバイル向けのコンポーネントだけではなく、データグリッドや、コンボ、カレンаダーなど、業務アプリで必須の機能を持ったコンポーネントを提供しています。

Ignite UI for Angular のバージョニング

Ignite UI for Angular は、有名なセマンティックバージョニングとは異なる方式でバージョンがつけられています。詳しくは下記の記事をご覧ください。

Ignite UI for Angular 18.2.17 リリースノート

ここからは、GitHub の 18.2.17 リリースノートを訳したものです。読みやすいように意訳をいれていますので、必ず本文を確認してください。

新機能

本リリースに新機能・拡張機能は含まれておりません。

不具合修正

縮小可能な複数列ヘッダーのエクスポート時に、正しいグリッドの列コレクションを取得するよう修正しました (#15248)。
fix(chip): suffix および prefix のテキストが長い場合に、省略記号による表示が適用されるよう修正しました (#15396)。
fix(combo): 無効なコンボボックスでのクリアアイコンのホバー状態を修正しました (#15407)。
fix(days-view): day-item の選択ロジックを更新し、プレビュー範囲を含むように修正しました (#15420)。

Ignite UI for Angular 18.2.16 リリースノート

ここからは、GitHub の 18.2.16 リリースノートを訳したものです。読みやすいように意訳をいれていますので、必ず本文を確認してください。

新機能

本リリースに新機能・拡張機能は含まれておりません。

不具合修正

fix(moving-dir): takeUntil のインポートを RxJS 6 と互換性のある形式に修正しました (#15393)。

Ignite UI for Angular 18.2.15 リリースノート

ここからは、GitHub の 18.2.15 リリースノートを訳したものです。読みやすいように意訳をいれていますので、必ず本文を確認してください。

新機能

本リリースに新機能・拡張機能は含まれておりません。

不具合修正

fix(combo): コンボの検索の入力テーマとタイプを修正しました (#15350)。
fix(time-picker): SSR のトグルイベントを除外しました (#15360)。
AM/PM を操作する際に、時間が常に 0～23 の範囲内に固定されるようにしました (#15369)。

Ignite UI for Angular 18.2.14 リリースノート

ここからは、GitHub の 18.2.14 リリースノートを訳したものです。読みやすいように意訳をいれていますので、必ず本文を確認してください。

新機能

本リリースに新機能・拡張機能は含まれておりません。

不具合修正

fix(igxTreeGrid): 縮小の後に正しい行を再評価しました。テストを追加しました (#15329)。
fix(combo): fix(mem-leak): 潜在的なメモリリークを修正しました (#15309)。

Ignite UI for Angular 18.2.13 リリースノート

ここからは、GitHub の 18.2.13 リリースノートを訳したものです。読みやすいように意訳をいれていますので、必ず本文を確認してください。

新機能

本リリースに新機能・拡張機能は含まれておりません。

不具合修正

fix(input-group): マテリアルテーマでヘルパーテキストの間隔を修正しました (#15277)。
fix(combo): igx-combo-add-item のスタイルを更新しました (#15273)。
fix(icon-button): マテリアルアウトラインボタンの z-index を削除しました (#15312)。

Ignite UI for Angular 18.2.12 リリースノート

ここからは、GitHub の 18.2.12 リリースノートを訳したものです。読みやすいように意訳をいれていますので、必ず本文を確認してください。

新機能

本リリースに新機能・拡張機能は含まれておりません。

不具合修正

refactor(*): 未使用のスタンドアロンインポートを整理しました (#15214)。
show メソッドで提供されたオーバーレイ設定を使用するように修正しました (#15285)。
open メソッドで提供された部分的なオーバーレイ設定を使用するように修正しました (#15288)。
fix(month-view/year-view): onMouseDown イベントを作成しました (#15291)。

Ignite UI for Angular 18.2.11 リリースノート

ここからは、GitHub の 18.2.11 リリースノートを訳したものです。読みやすいように意訳をいれていますので、必ず本文を確認してください。

新機能

本リリースに新機能・拡張機能は含まれておりません。

不具合修正

fix(carousel): スライドのコンストラクターにインターフェースを注入しました (#15240)。
fix(esf): キャンセルボタンをクリックした際に Excel スタイルフィルタリングメニュー内のフィルターを破棄するように修正しました (#15242)。
fix(columns): 列の幅の解析方法を変更しました (#15008)。
fix(checkbox/switch/radio): 一貫性のないカーソル動作を修正しました (#15230)。

Ignite UI for Angular 18.2.10 リリースノート

ここからは、GitHub の 18.2.10 リリースノートを訳したものです。読みやすいように意訳をいれていますので、必ず本文を確認してください。

新機能

本リリースに新機能・拡張機能は含まれておりません。

不具合修正

fix(i18n): 高度なフィルタリングの「キャンセル」と「適用」ボタンのテキストを大文字で始まるように変更しました (#15167)。
fix(hierarchical-grid): 欠落していた境界線を追加しました (#15189)。
fix(checkbox): 無効状態に関連する問題を修正しました (#15199)。
fix(linear-progress): RTL (右から左) の設定時にプログレストラックが方向を変更しない問題を修正しました (#15185)。
fix(igxGrid): グリッドと列が % 幅を持つ場合に、非表示コンテナー内で発生する問題を修正しました (#15160)。
fix(grid): 列のサイズ変更ラインの位置と拡大縮小されたグリッドでの列サイズ変更の問題を修正しました (#15062)。
fix(themes): igx-icon が複数のテーマで上書きされる問題を修正しました (#15221)。
fix(igxHierarchicalGrid): 子列用に列をコピーする前に、列のグリッドオーナーを修正しました (#15206)。
1 文字のみを含むフィルター値を追加するときに発生するエラーを修正しました (#15196)。
フィルターをクリアする際に選択された条件をクリアするようにしました (#15217)。

Ignite UI for Angular 18.2.9 リリースノート

ここからは、GitHub の 18.2.9 リリースノートを訳したものです。読みやすいように意訳をいれていますので、必ず本文を確認してください。

新機能

本リリースに新機能・拡張機能は含まれておりません。

不具合修正

fix(avatar): src 文字列に ( または ) が含まれる場合に背景 URL が壊れる問題を修正しました (#15176)。

Ignite UI for Angular 18.2.8 リリースノート

ここからは、GitHub の 18.2.8 リリースノートを訳したものです。読みやすいように意訳をいれていますので、必ず本文を確認してください。

新機能

本リリースに新機能・拡張機能は含まれておりません。

不具合修正

refactor(themes): テーマプリセットのミックスインを更新しました (#15164)。

Ignite UI for Angular 18.2.7 リリースノート

ここからは、GitHub の 18.2.7 リリースノートを訳したものです。読みやすいように意訳をいれていますので、必ず本文を確認してください。

新機能

本リリースに新機能・拡張機能は含まれておりません。

不具合修正

fix(ssr): 純粋な document 呼び出しをすべて注入されたドキュメントに置き換えました (#15119)。
fix(avatar): src プロパティが null の場合にエラーが発生する問題を修正しました (#15131)。
test(card): カードコンテンツ内のアイコンのフォントファミリーに関するテストを追加しました (#15134)。
refactor(avatar): 使用されていないコードを削除しました (#15153)。
fix(combo): 検索入力フィールドのパディングを修正しました (#15152)。
fix(combo): 検索入力フィールドの開始と終了に min-width を使用し、アイコンのサイズを更新しました (#15109)。
fix(*): スコープ指定されたテーマでアイコンサービスが動作しない問題を修正しました (#15150)。

Ignite UI for Angular 18.2.6 リリースノート

ここからは、GitHub の 18.2.6 リリースノートを訳したものです。読みやすいように意訳をいれていますので、必ず本文を確認してください。

新機能

本リリースに新機能・拡張機能は含まれておりません。

不具合修正

fix(combo): ngIf を入力グループではなく検索ラッパーに移動しました (#15087)。
fix(excel-style-filtering): フィルター値が初期化されない問題を修正しました (#15111)。
fix(tree): ツリー内のチェックボックス間隔を更新しました (#15116)。

Ignite UI for Angular 18.2.5 リリースノート

ここからは、GitHub の 18.2.5 リリースノートを訳したものです。読みやすいように意訳をいれていますので、必ず本文を確認してください。

新機能

本リリースに新機能・拡張機能は含まれておりません。

不具合修正

fix(calendar): 異なる Realm のオブジェクトでも isDate が機能するように修正しました (#15082)。
fix(moving): 一部のイベントリスナーを削除し、サブスクライバーをデタッチするようにしました (#15047)。
fix(ssr): ResizeObserver とアニメーションプレイヤーのエラーを修正しました (#15097)。
fix(themes): Indigo テーマの色を更新しました (#15091)。
fix(igxPivot): 幅が指定されていないフレックスコンテナ内での幅の計算を修正しました (#15058)。

Ignite UI for Angular 18.2.4 リリースノート

ここからは、GitHub の 18.2.4 リリースノートを訳したものです。読みやすいように意訳をいれていますので、必ず本文を確認してください。

新機能

本リリースに新機能・拡張機能は含まれておりません。

不具合修正

refactor(tabs): デザインを最新の Web Components リポジトリの変更と一致させました (#15030)。
fix(query-builder): 空のグループを削除しました (#15013)。
fix(datepicker): ヘッダータイトルのテンプレート化に関する問題を修正しました (#15045)。
feat(themes): コンポーネントに theme プロパティを追加しました (#15061)。
fix(date-range): 連続して閉じた場合に投影された入力に正しく復元されるようにしました (#14951)。
refactor(list): 項目のギャップとマージンを調整しました (#15066)。
fix(avatar): src が URI としてエンコードされていない問題を修正しました (#15069)。
fix(checkbox): Indigo テーマで目盛りが正しく表示されない問題を修正しました (#15067)。
fix(themes): igx-icon-button の欠落していた依存関係を追加しました (#15077)。

Ignite UI for Angular 18.2.3 リリースノート

ここからは、GitHub の 18.2.3 リリースノートを訳したものです。読みやすいように意訳をいれていますので、必ず本文を確認してください。

新機能

本リリースに新機能・拡張機能は含まれておりません。

不具合修正

fix(navigation-drawer): ARIA ロールの問題の警告を修正しました (#14977)。
refactor(combo): ID セッターで設定された選択のみを処理するように変更しました (#14964)。
グループ化されたヘッダーの高さの問題を修正しました (#15001)。
fix(combo): touched プロパティを更新し、必要に応じてぼかしに無効な色を適用するように修正しました (#14967)。
fix(grid,filtering): 式ツリーインターフェースのオプションの検索メソッド (#15018)。
大文字と小文字を区別しない重複レコードでグリッドを正しくフィルタリングするようにしました (#14946)。
test(hgrid): 階層グリッド内のスクロール時のちらつきを修正しました (#15031)。
refactor(time-picker): 冗長なスタイルを削除しました (#14927)。
test(combo): スクロールテストのちらつきを修正しました (#15041)。
fix(dropdown): boostrap および fluent テーマのタイポグラフィを修正しました (#15037)。
deps(theming): テーマパッケージをバージョン 14.2.0 に更新しました (#15042)。
fix(slider): 上部のつまみが小数ステップで最大値に達するように修正しました (#15023)。
fix(dialog): UI キットとダイアログの不一致を修正しました (#15033)。

Ignite UI for Angular 18.2.2 リリースノート

ここからは、GitHub の 18.2.2 リリースノートを訳したものです。読みやすいように意訳をいれていますので、必ず本文を確認してください。

新機能

本リリースに新機能・拡張機能は含まれておりません。

不具合修正

ci(*): puppeteer を最新版に更新しました (#14983)。
fix(editing): 編集終了時にアクティベーションクリアを再トリガーするように修正しました (#14894)。
fix(ExcelExporter): セル値から null 文字を削除しました (#14995)。
test(combo): 新しい puppeteer でコンボテストを修正しました (#14994)。

Ignite UI for Angular 18.2.1 リリースノート

ここからは、GitHub の 18.2.1 リリースノートを訳したものです。読みやすいように意訳をいれていますので、必ず本文を確認してください。

新機能

本リリースに新機能・拡張機能は含まれておりません。

不具合修正

fix(textarea): 無効な状態のカーソルを修正しました (#14953)。
fix(expansion-panel): bootstrap タイポグラフィを修正しました (#14855)。

Ignite UI for Angular 18.2.0 リリースノート

一般

IFilteringExpressionsTree、FilteringExpressionsTree

非推奨 - find および findIndex メソッドは非推奨になり、将来のバージョンで削除される予定です。同じ機能を提供する ExpressionsTreeUtil クラスが追加されました。

新機能

IgxSimpleCombo

Simple Combo で [Tab] キーを押すと、自動的に有効な入力を選択および保持する機能を導入しました。これにより、データ入力が効率化され、手動選択の必要性が減少し、フォームナビゲーションが改善され、ユーザーエクスペリエンスが向上します。

IgxGrid、IgxTreeGrid、IgxHierarchicalGrid

カスタム形式を使用した列のソートを効率化するために、新しい FormattedValuesSortingStrategy が導入されました。このストラテジは、フォーマットされた値に基づいて直接ソートを可能にすることで、DefaultSortingStrategy の拡張やカスタム ISortingStrategy の実装の必要性を排除し、ソートプロセスを簡素化します。この機能強化により、カスタム列フォーマッタを使用したソートの処理が容易になります。

IgxCarousel

垂直方向の配置のサポートが追加されました。vertical プロパティで設定できます。デフォルトは false です。
インジケーターコントロール (ドット) の表示/非表示のサポートが追加されました。indicators プロパティで設定できます。デフォルトは true です。

ColumnType、IgxColumn

date、dateTime、time タイプの列の組み込みエディターは、IgxGrid の locale に応じてデフォルトの入力形式を使用するようになりました。これは、セルエディターと、すべてのモードのフィルタリング UI (quickFilter、excelStyle、および高度なフィルタリング) の両方に有効です。
日付/時刻列の pipeArgs.displayFormat プロパティが設定されており、数値の日時部分のみ、またはエディターで処理できる部分のみが含まれている場合、組み込みエディターの入力形式はそこから推測されます。
組み込みエディターを構成するために、オプションのパラメーターを渡すことができる新しい editorOptions プロパティが追加されました。dateTimeFormat プロパティを持つ IColumnEditorOptions オブジェクトを受け入れます。これは、date、dateTime および time 列データタイプのエディターの入力形式として使用されます。

例:

    const editorOptions: IColumnEditorOptions = { Field?
        dateTimeFormat: 'MM/dd/YYYY',
    }

例:

    <igx-column field="sampleDate" dataType="date" [editorOptions]="editorOptions"></igx-column>

FieldType (IgxQueryBuilder)

上記と同様に、フィールドは IFieldEditorOptions タイプの editorOptions オブジェクトを受け入れるようになりました。dateTimeFormat プロパティは、日付/時刻フィールドのクエリエディターの入力形式として使用されます。

IgxDateTimeEditor、IgxDatePicker、IgxTimePicker、IgxDateRangePicker

inputFormat プロパティが設定されていない場合、入力形式は、displayFormat が設定されていて数値の日付と時刻の部分のみが含まれている場合は、displayFormat から推測されます。

IgxTimePicker

入力および表示形式がロケールに基づいて調整されるようになりました。たとえば、曜日の時間部分 (AM/PM または a/p) は、それを必要としないロケールでは表示されません。

IgxDateTimeEditor

エディターマスクに含まれるターゲットタイプに応じて日付と時刻の部分を構成する新しい defaultFormatType プロパティ (date | time | dateTime) が追加されました。デフォルトは date です。

IgxTabs

タブ選択を制御するための activation プロパティが追加されました。auto モード (デフォルト) では、矢印キーまたは Home/End キーでタブが即座に選択されます。manual モードでは、タブはキーでフォーカスされますが、選択できるのは Enter キーまたは Space キーのみです。

IgxGridState

可能であれば、State ディレクティブは、毎回新しい列インスタンスを作成するのではなく、状態を復元するときにグリッド上に既に存在する列を再利用します。これにより、columnInit で複雑なオブジェクトを手動で列に設定し直す必要がなくなります。これがまだ必要な唯一の例は、列 (または列グループの場合はその子) に field プロパティがなく、一致する列を一意に識別する方法がない場合です。
複数行レイアウトの永続化のサポートが追加されました。

テーマ

重大な変更 - パレット

すべてのパレットカラーは CSS 相対カラー構文に移行されました。これにより、CSS 変数として使用されるカラーは、もはや hsl 関数でラップする必要がなくなりました。

例:

/* 18.1.x and before: */
background: hsl(var(--ig-primary-600));

/* 18.2.0+: */
background: var(--ig-primary-600);

この変更により、他の CSS 変数を含む任意のカラーから CSS で各カラーの基本 (500) バリエーションを宣言できるようになりました。以前は、基本カラーから色合いを生成するには Sass palette 関数が必要でした。

例:

/* 18.1.x and before: */
$my-palette: palette($primary: #09f, ...);

/* 18.2.0+: */
--ig-primary-500: #09f;

この変更は、Sass と同様に CSS でもテーマを構成できるようにするための継続的な取り組みの一環です。

スクロールバー: 新規 CSS 変数

よりカスタマイズ可能なスクロールバーを可能にするために、新しい CSS 変数を導入しました。この機能強化では、::-webkit-scrollbar-track などの利用可能な WebKit 疑似セレクターを利用します。ただし、これらの疑似セレクターには -webkit- というプレフィックスが付いており、WebKit ベースのブラウザー (Chrome、Safari など) でのみサポートされていることに注意してください。

-webkit- ブラウザーで利用可能な CSS 変数は以下のとおりです:

--sb-size: スクロールバーのサイズ (幅と高さ) を調整します。
--sb-track-bg-color: スクロールバートラックの背景色を設定します。
--sb-track-bg-color-hover: ホバー時のスクロールバートラックの背景色を設定します。
--sb-thumb-min-height: スクロールバーのつまみの最小高さを設定します。
--sb-thumb-border-radius: スクロールバーのつまみの境界線の半径を設定します。
--sb-thumb-border-size: スクロールバーのつまみの境界線のサイズを設定します。
--sb-thumb-border-color: スクロールバーのつまみの境界線の色を設定します。
--sb-thumb-bg-color: スクロールバーのつまみの背景色を設定します。
--sb-thumb-bg-color-hover: ホバー時のスクロールバーつまみの背景色を設定します。

Firefox ユーザー向けには、次の CSS 変数を通じて限定的なスクロールバーのスタイル設定オプションを提供しています。

--sb-size: スクロールバーのサイズを調整します。
--sb-thumb-bg-color: スクロールバーのつまみの背景色を設定します。
--sb-track-bg-color: スクロールバートラックの背景色を設定します。

一般

IgxGrid、IgxTreeGrid、IgxHierarchicalGrid、IgxPivotGrid

非推奨 - shouldGenerate プロパティは非推奨になり、将来のバージョンで削除される予定です。列の再作成は、代わりに autoGenerate に依存するようになりました。自動移行が利用可能で、ng update 時に適用されます。autoGenerate がすでに初期設定されている場合は、コード内の他の場所で明示的に設定する必要がないことに注意してください。

IgxCarousel

animationType 入力プロパティのタイプが CarouselAnimationType になりました。HorizontalAnimationType も使用できますが、垂直スライドアニメーションをサポートする新しい垂直モードに対応するには、CarouselAnimationType を使用することをお勧めします。
動作の変更 - keyboardSupport 入力プロパティのデフォルトが false になりました。
非推奨 - keyboardSupport 入力プロパティは非推奨になり、将来のバージョンで削除される予定です。 Tab/Shift+Tab でインジケーターのコンテナーにフォーカスを合わせると、左矢印、右矢印、Home、End キーによるキーボードナビゲーションがサポートされます。

IgxCombo

重大な変更 - 非推奨の filterable プロパティは、disableFiltering に置き換えられました。
ドロップダウン検索フィールドのプレースホルダーは、Combo のローカリゼーションリソースの一部になりました。また、フィルタリングがアクティブかどうかに応じて 2 つのリソース値も使用されるようになりました。たとえば、デフォルトの en ロケールでは 'Enter a Search Term' のままですが、disableFiltering と allowCustomValues が true に設定されている場合、'Add Item' に変わります。そのため、既存の searchPlaceholder 入力も非推奨となり、代わりにリソースが使用されるようになりました。
非推奨 - filterable は、disableFiltering に置き換えられ、filteringOptions から非推奨になりました。

IgxBadge

重大な変更 - $border-width プロパティがバッジテーマから削除されました。
Badge コンポーネントの新しいアウトラインバリアントが追加されました。ユーザーは、新しく作成された outlined プロパティをバッジに追加することで、outlined に切り替えることができます。