Ignite UI for Angular

IgxGrid: IgxFocus ディレクティブを使って編集開始時にセル編集テンプレートにフォーカスを当てる

IgxGrid のセル編集テンプレートには、デフォルトの状態ではフォーカスは当たりません。セル編集の開始と共に編集テンプレートにフォーカスを当てるためには、セル編集テンプレート内のフォーカスを当てたいコントロールに、Ig […]

注意この機能は現在ベータ版です。今後変更になる可能性があるため予めご了承ください。これまでは、IgxGrid で [rowSelectable]=”true” にセットしただけでは、複数行を選 […]

IgxGrid それ自体には、CSVファイルを読み込む機能はありませんが、FileReader を組み合わせることで、CSVファイル読み込み機能を実現することができます。大まかな処理の流れとしては、以下のようになります。 […]

IgxGrid のドラッグアンドドロップ機能を用いて、行の位置を移動することができます。 rowDraggable オプションを有効化することで、行のドラッグができるようになります。igxDrop ディレクティブを有効化 […]

IgxGrid の disablePinning オプションに true を設定することで、マウス操作による列固定を禁止することができます。実行結果

igniteui-angular とは？ igniteui-angular は、Ignite UI for Angular のパッケージです。 Ignite UI for Angular は、Angular Materi […]

IgxGrid の編集機能では、デフォルトエディタの代わりに好きな入力エディタを使うようカスタマイズすることができます。IgxSelect を組み込んでみます。 1. IgxSelectModule を import し […]

1. リソース文字列用の igniteui-angular-i18n パッケージをインストールします。 2. Angular 自体で ja-JP ロケールを使用するように登録し、igniteui-angular の方では […]

IgxGrid の IgxColumn で公開されている headerClasses を利用することで、列ヘッダーにスタイルを適用することができます。

IgxGrid の IgxColumnGroup で公開されている headerGroupClasses を利用することで、複数列ヘッダーにスタイルを適用することができます。