Articles Tagged: IgxGrid

IgxGrid では、ビルトインの機能として、タブ(Tab)によるエクセルライクなセル移動を行うことができます。 Tab 押下・・・右隣のセルに移動。一番右の列まで進むと、次の行の一番左の列に移動します。Shift + […]

Ignite UI for Angular 9.1.7 バージョン時点での情報に基づいています。 IgxGrid の列にある editable オプションを有効化することで、セルの編集を行うことができます。 サンプル

IgxGrid では、１データレコードを複数行にわたって表示することができます。 IgxGrid 配下の IgxGridColumnLayout を定義し、その配下に列を定義します。また、各列のレイアウトは rowSta […]

IgxGrid では、セルやヘッダの表示間隔を調整することができます。デフォルトの状態では、ヘッダやセルなどの UI 要素に対して Material Design に準拠した空間的余裕が与えられています。ただし、状況によ […]

IgxGrid の列を動的に生成する方法を紹介します。 列とデータの準備 あらかじめ列定義とバインドするデータを用意しておきます。 IgxGrid の定義 配列 columns をループで回し、IgxGridColumn […]

IgxGrid では、ヘッダーテンプレート機能を利用することで、ヘッダーのカスタマイズができます。 ヘッダーテンプレートは、列に対して igxHeader ディレクティブを適用することで実現することができます。 参考情報 […]

IgxGrid の表示セルに対してテンプレートを適用することで、一つのセルに複数のデータをバインドすることができます。 表示セルに対してテンプレートを適用するには、IgxCell ディレクティブを利用します。ng-tem […]