インフラジスティックス・ジャパン株式会社Blog

インフラジスティックス・ジャパン株式会社のチームメンバーが技術トレンド、製品Tips、サポート情報からライセンス、日々の業務から感じることなど、さまざまなトピックについてお伝えするBlogです。

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

Ignite UI for Angularリリースノート

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

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

はじめに

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

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

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

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

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

新機能

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

不具合修正

  • fix(date-time-editor): マスク値の ISO 日付文字列を理実装するようする修正しました (#14033)。
  • fix(chip/query-builder): 高度なフィルタリング コンテキストのチップを修正しました (#14084)。

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

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

新機能

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

不具合修正

  • fix(grid): 編集を終了する前に編集テンプレートからフォーカスを外し、editValue が更新され、変更がトリガーされるように修正しました (#14027)。
  • fix(slider): 同期された双方向バインディングにおける igx-slider の動作を修正しました (#14055)。

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

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

新機能

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

不具合修正

  • fix(hgrid): テンプレート コンテキストで grid インスタンスを公開しました (#13997)。

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

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

新機能

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

不具合修正

  • グループの後に初期化されるとボタンが選択されない問題を修正しました (#13973)。

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

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

新機能

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

不具合修正

  • fix(igxGrid): rowAdd イベント引数の新しいデータを発行するように修正しました (#13991)。

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

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

新機能

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

不具合修正

  • fix(advanced-filtering): GridType でオーバーレイ設定を渡すように修正しました (#13974)。

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

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

新機能

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

不具合修正

  • fix(igxForOf): 水平スクロールの不要なスクロール位置の再描画を削除しました (#13946)。
  • fix(rowIsland): 要素を描画しないため、行の島の幅が計算されないように修正されました (#13951)。

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

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

新機能

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

不具合修正

  • IgxGridState: 縮小可能な列グループが正しく動作しない問題 (#13931)。
  • fix(select): IgxSelectionAPIService のメモリ リークを修正しました (#13929)。

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

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

新機能

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

不具合修正

  • ci(schematics): CI での schematics と migrations の構築 (#13902)。
  • fix(calendar): 同じ日付がすでに設定されている場合、日付の設定はない問題 (#13890)。
  • fix(hierarchical-grid): データがユーザーによって明示的に設定されている場合は、階層パイプ データを使用しないように修正しました (#13889)。
  • 集計を含むグループ化されたグリッドのエクスポートを修正しました (#13921)。

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

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

新機能

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

不具合修正

  • fix(buttonGroup): 初期化する際の buttonSelected 発行に関する問題を解決しました (#13861)。
  • fix(grid): コレクションが変更され、列が動的にレンダリングされるとき、ピン固定された列および列グループを処理するように修正しました (#13846)。

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

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

新機能

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

不具合修正

  • fix(buttonGroup): 選択したプロパティの値が変更すると、ボタンの選択を解除するように修正しました (#13817)。
  • fix(grid): グループ化された IgxGrid での Shift キーを押しながらクリックする選択を修正しました (#13823)。
  • fix(i18n): Excel のマッチ数のローカリゼーションを更新しました (#13830)。
  • fix(tree-grid): 全てのデータから newSelection を取得するように修正しました (#13825)。

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

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

新機能

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

不具合修正

  • fix(igxDrag): ドラッグ要素を移動するときに ghost テンプレートを復元するように修正しました (#13807)。
  • fix(igxGrid): ズームアウトしたときに不一致がないように、グリッド幅を測定するときに float 値を保持するように修正しました (#13805)。

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

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

新機能

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

不具合修正

  • fix(*): ラベルのクリック時に input をフォーカスするように修正しました (#13780)。
  • fix(simple-combo): paste イベントを処理する修正を実装しました (#13787)。
  • fix(stepper): アクティブなステップをクリックしたときにエラーがスローされないようにしました (#13794)。

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

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

新機能

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

不具合修正

  • fix(igxHierarchicalGrid): ルート階層グリッドがアクション ストリップに対して、直接の子孫のみ取得することを確認するように修正しました (#13777)。

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

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

新機能

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

不具合修正

  • fix(hGrid): mch を使用して子グリッドのイベントを発行するように修正しました (#13735)。
  • chore(*): 'fflate' を v0.8.1 に更新しました (#13713)。
  • fix(navbar): AppBuilder 上でのアイコンの色を修正しました (#13730)。

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

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

新機能

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

不具合修正

  • キャッシュのリセットが呼び出されたときにサマリー サイズを再計算するように修正しました (#13729)。
  • fix(excel search): 一致しない場合の onFocus エラーを修正しました (#13744)。

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

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

新機能

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

不具合修正

  • fix(igxForOf): スクロール位置で state.startIndex をリセットしないように修正しました (#13721)。
  • 修正: column と columnGroup が同じヘッダーを持つ場合、setState() がエラーをスローする問題 (#13710)。

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

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

新機能

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

不具合修正

  • fix(density): DOCUMENT トークンを注入するように修正しました (#13698)。
  • fix(tree): 新しいホバー選択カラー フォーム スキーマを使用し、不足しているホバー時の色をユーザーに公開しました (#13699)。
  • ESF キーボード ナビゲーションのアクティブな要素が最初または最後の場合はフォーカスを変更しないように修正しました (#13687)。

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

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

新機能

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

不具合修正

  • fix(simple-combo): ドロップダウンが開いているときに Enter キーでのみ選択するように修正しました (#13609)。
  • fix(grids): disablePinning プロパティを保存するように修正しました (#13653)。
  • ix(grid): 欠落している clipboardOptions のインターフェースを追加しました (#13683)。
  • fix(chip): igx-suffix および igx-prefix ディレクティブ内のアバターを修正しました (#13695)。

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

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

新機能

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

不具合修正

  • ci(publish): GITHUB_ENV に出力する NODE_OPTIONS は非推奨になりました (#13665)。
  • ESF 検索リストでのナビゲーションのサポートを追加しました (#13666)。

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

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

新機能

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

不具合修正

  • fix(igxGrid): init でソート オプションが設定されている場合、sortingExpressions がクリアされないようにしました (#13611)。
  • fix(lint): lint の高速化 (#13649)。
  • fix(igxGrid): 非表示の空の列ヘッダーの自動サイズを正しく調整するようにしました - 16.1.x (#13628)。
  • fix(igxPivotGrid): すべてのディメンションと値を削除したためにデータが空になった場合のチェックを追加しました (#13614)。
  • feat(esf): 検索結果のアクセシビリティを向上しました - 16.1.x (#13558)。

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

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

新機能

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

不具合修正

  • fix(IgxForOf): DOM でノードが見つからない場合のチェックを追加しました (#13604)。
  • ビュー内でフォーカスされた要素をスクロールしたときにヘッダーのスクロール位置を調整するようにしました --16.1 (#13599)。
  • fix(migrations): コメントを含む完全な ts を取得するようにしました (#13638)。
  • fix(overlay): 挿入されたドキュメントを show メソッドに使用するようにしました - 16.1 (#13633)。
  • fix(button-group): 選択されたイベントと選択解除されたイベントでのキャンセル可能を元に戻しました - 16.1 (#13631)。

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

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

新機能

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

不具合修正

  • refactor(rating): スキーマの色を使用するように rating テーマを更新しました (#13541)。
  • refactor(theming): 基本フォント サイズを設定するオプションを追加しました (#13587)。
  • fix(snackbar): igx-snackbar が igxButton を使用するようにしました (#13584)。
  • groupingDone が発行されたときに更新された値を返すようにしました (#13589)。
  • fix(esf): 条件付きフィルターのドロップダウン項目のフォーカスの修正 - 16.1.x (#13591)。

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

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

新機能

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

不具合修正

  • chore(*): SECURITY.md を作成しました (#13545)。
  • README.md を更新しました (#13561)。
  • 16.1.x から master への一括マージ (#13530)。
  • chore(*): update-readme-roadmap-17-oct/23 (#13560)。
  • fix(buttons): 欠落していた type=button を追加しました (#13572)。
  • README.md を更新しました (#13581)。
  • build(deps-dev): @babel/traverse を 7.23.0 から 7.23.2 に変更しました (#13564)。
  • fix(migrations): 文字列リテラルの代わりに正規表現リテラルを使用するようにしました (#13577)。
  • README.md を更新しました (#13582)。

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

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

新機能

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

不具合修正

  • build(sass): gulp-sass から sass-embedded に変更しました (#13517)。
  • fix(simple-combo): リモート データにバインドされているとき、フォーカスを失うときに入力をクリアするようにしました (#13507)。
  • fix(button-group): 実行時に selectionMode プロパティが変更された時にボタン グループをリセットするようにしました (#13542)。

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

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

新機能

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

不具合修正

  • docs(changelog): サイズ変更をより適切に表現するために変更ログを変更しました (#13529)。
  • fix(badge): 値 0 は描画されない問題 (#13536)。
  • fix(avatar): size 属性をより具体的にしました (#13535)。
  • フォーマットされた列データをエクスポートするようにしました (#13523)。
  • fix(grids): セル幅をリファクタリングしました (#13460)。

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

新機能

IgxSelect:

  • Select コンポーネントは、igx-select-item 内の igxPrefix および igxSuffix ディレクティブを処理できるようになりました。 
   <igx-select-item>
       <igx-icon igxPrefix>alarm</igx-icon>
       Select item text content
       <igx-icon igxSuffix>alarm</igx-icon>
   </igx-select-item>
 

IgxBadge:

  • 他のカスタム アイコン セットとともに拡張されたマテリアル アイコンを Badge コンポーネント内で使用できるようになりました。
  • コード例:
import { IgxBadgeComponent, IgxIconService } from 'igniteui-angular';
import { heartMonitor } from '@igniteui/material-icons-extended';

export class BadgeSampleComponent implements OnInit {
   constructor (protected _iconService: IgxIconService) {}

   public ngOnInit() {
       this._iconService.addSvgIconFromText(heartMonitor.name, heartMonitor.value, 'imx-icons');
   }
}
 
   <igx-badge icon="heart-monitor" iconSet="imx-icons"></igx-badge>
 

IgxCombo:

  • 付加記号を基本表現に正規化する comboIgnoreDiacriticsFilter フィルター関数を公開しました。Combo コンポーネントがそれを使用して構成されている場合、「resume」のフィルタリングはresume」résumé」の両方に一致します。

IgxComboIgxSimpleCombo

  • 表示キーの配列を返す新しい displayValue プロパティが追加されました。

IgxButtonGroup:

  • 発行ボタン グループ インスタンスを識別するために、ownerIButtonGroupEventArgs に追加しました。
  • 重大な変更: IgxButtonGroupのボタンの選択モードを設定するselectionMode プロパティが追加されました。選択モードは、singlesingleRequired、および multi (デフォルトは single) です。
  • 重大な変更: multiSelection プロパティは非推奨となり、すべての参照は selectionMode="multi" に移行されました。

テーマ:

  • igxLabel ディレクティブにスタンドアロン テーマを含めて、入力グループ外のコンポーネントで使用できるようにしました。

一般

IgxStepper:

  • 重大な変更: IgxStepSubTitleDirective の名前が IgxStepSubtitleDirectiveに変更されました。自動移行が利用可能で、ng update 時に適用されます。

IgxGridIgxTreeGridIgxHierarchicalGrid

  • 列ヘッダーがテンプレート化されており、イベントのハンドラーをトリガーするために列の移動が有効になっている場合、インタラクティブな要素に draggable 属性を設定する必要はなくなりました。ユーザーがその要素によって列をドラッグできないようにする必要がある場合は、draggable='false' を追加として使用できるようになりました。ただし、省略した場合でも、click イベントがトリガーされるようになりました。
  • 動作の変更: すでにグループ化された列がある場合、クリック操作のみが実行されたときではなく、列のドラッグが開始された後にグループ ドロップ領域が表示されるようになりました。

IgxComboIgxSimpleCombo:

  • 重大な変更: 値キーが指定されている場合でも、selection プロパティは選択された項目の配列を返し、value プロパティは表示キーではなく値キーの配列を返します。自動移行が利用可能で、 ng update 時に適用されます。
  • 非推奨DisplayDensityToken インジェクション トークンは非推奨になりました。 したがって、DisplayDensityToken を挿入するすべてのコンポーネントの displayDensity 入力も非推奨になります。
  • コンポーネントのサイズの変更は、新しいカスタム CSS プロパティを介して行う必要があります - --ig-size;
    • コード例:
// *.component.ts
// remove the provider declaration for `DisplayDensityToken`
providers: [{ provide: DisplayDensityToken, useValue: { displayDensity: DisplayDensity.compact } }],
 
<!-- Remove `[displayDensity]="'compact'"` -->
<igx-grid [displayDensity]="'compact'">...</igx-grid>
 
/* 
Add --ig-size to a component or global file.
Available values are:
compact: --ig-size-small
cosy: --ig-size-medium
comfortable: --ig-size-large
*/
igx-grid {
    --ig-size: var(--ig-size-small);
}

サンプル

Ignite UI for Angular を初めて使う、という方は是非こちらから

Angular API

Ignite UI for Angular の API はこちらから

ナレッジベース

お客様の問題解決に役立つナレッジベースを公開しています。

ナレッジベースはこちらから

https://kb.jp.infragistics.com/