IgxGrid

IgxGrid – 2つのグリッドのスクロールを同期させる

IgxGridを複数個置いてスクロールを同期させたい場合は、IgxGridのgridScrollイベントを使ってそれぞれのスクロール位置を同じ値にします。スクロール位置は、IgxForOfディレクティブで制御できます。 […]

header 用の JSON データを用意し、そのデータを使って複数列ヘッダを定義する方法をご紹介します。構築する Gird イメージはこちらです。用意する header 用の JSON データはこちらこの hea […]

igxGrid ではバージョン10.1.0より、デフォルトのテンプレートを使用するセル(集計セルを含む)に自動的にツールチップが表示されるようになりました。このデフォルトのツールチップを非表示にするプロパティが現在は未 […]

Ignite UI for Angular 13.1.7 バージョン時点での情報に基づいています。 Ignite UI for Angular で提供している IgxGrid において、全ページの全レコードをチェック（選 […]

IgxGrid のテンプレート機能を利用し、常にエディタを表示してみます。テンプレート機能は、次の様に igx-column 配下に、ng-template を配置し、igxCell ディレクティブを付与します。そしてそ […]

Ignite UI for Angular 12.0.5 バージョン時点での情報に基づいています。 IgxGrid の横幅を、ウィンドウ幅に応じて動的に変更するサンプルです。ウィンドウ幅が変更になったタイミングを検知し […]

IgxGridComponentのfilteredDataアクセサよりフィルター後のデータコレクションを取得することができます。以下のサンプルでは、filteringDoneイベントで現在の表示行数をグリッドの上に表示 […]

Ignite UI for Angular 11.1.10 バージョン時点での情報に基づいています。 IgxGrid では、IgxGridStateDirective と連携することで、IgxGrid の各種状態を保存・ […]

Ignite UI for Angular 11.1.10 バージョン時点での情報に基づいています。 IgxGridの集計行の表示・非表示を動的に切り替えたい場合は、各列（IgxColumnComponent）のhasS […]

Ignite UI for Angular 11.2.12バージョン時点での情報に基づいています。 igxGrid は、列を非表示機能を提供しています。また、非表示にした列は、ツールバーから再表示することができますが、 […]