コンテンツへスキップ
5 必須のAngularグリッド行機能とその使用方法

5 つの必須のAngularグリッド行機能とその使用方法

次のプロジェクトに取り組む際に考慮すべきAngularグリッドロウの必須機能は何ですか?この記事では、トップ5について説明します。詳細をご覧ください。

3分で読めます

ビッグデータを扱うのは、それほど簡単ではありません。すべてのコンポーネントは、エンドユーザーが使用するデータを実際に理解するための手段とツールを提供する必要があります。ここで、Ignite UI for Angularグリッドやリッチ行機能などのコンポーネントが便利です。

選択によるデータ分析

簡単に言えば、Angularのグリッド行機能とは何ですか?

グリッド行機能とは、特定のAngular UI ライブラリ (ライブラリなど) が提供する機能を指しますIgnite UI for Angularこれにより、開発者はグリッド コンポーネント内の行を効率的かつ簡単に管理および操作できます。

これが、あなたが持っていなければならない私のトップ5のAngularグリッド行機能です。

行の選択

Ignite UI for Angularで行を選択すると、行セレクター列は、行内の他のすべての列よりも前に配置されます。ユーザーが行セレクターをクリックすると、行が選択または選択解除され、ユーザーは複数のデータ行を選択できるようになります。

次のサンプルは、Grid の行選択動作の 3 種類を示しています。下のボタンを使用して、使用可能な各選択モードを有効にします。簡単な説明は、スナックバーのメッセージボックスを通じて各ボタンの操作について提供されます。切り替えボタンを使用して、行セレクターのチェックボックスを表示または非表示にします。

行選択の例

複数行のレイアウト

複数行レイアウトは、igxGridComponent のレンダリング機能を拡張します。この機能により、1つのデータレコードを複数の可視行に分割できます。

複数行レイアウト

行 UI アクション

Ignite UI for Angularのグリッド コンポーネントでは、ActionStripを使用し、行/セル コンポーネントと行ピン留めに CRUD を利用できます。Action Strip コンポーネントは、これらの操作の定義済み UI コントロールをホストできます。

行アクションの例

行の固定

1 つまたは複数の行をAngular UI グリッドの上部または下部にピン留めできます。行のピン留めIgnite UI for Angularでのを使用すると、エンドユーザーは特定の順序で行をピン留めし、グリッドを垂直にスクロールする場合でも、行を特別な可視領域に複製できます。マテリアル UI グリッドには、グリッドのコンテキストで igxActionStrip コンポーネントを初期化することで有効になる行固定 UI が組み込まれています。さらに、カスタム UI を定義し、行のピン留め状態を Row Pinning API を使用して変更できます。
行のピン留め

行のドラッグ

行ドラッグは、ユーザーが行のドラッグを開始できる行ドラッグハンドルを提供します。

行ドラッグの例

まとめ

市場で入手可能なAngular UIライブラリには、さまざまなグリッド行の特徴と機能があります。しかし、私にとって必須の機能は、まさに行選択、複数行レイアウト、ロールUIアクション、行のピン留め、および行のドラッグです。これらを使用すると、ユーザーは表形式のデータをより簡単に管理および操作できます。

詳細については、以下をご覧ください。

すべてを体験するには、カスタマーポータルにアクセスして最新バージョンを入手してください。いつものように、私たちはいつでもフィードバックをいただき、追加または推奨したいものを聞くことを楽しみにしています。ですから、zkolev@infragistics.com までメールで、インフラジスティックスで顧客に価値を提供し続けるのをどのように支援できるか教えてください。

Ignite UI for Angular利点

デモを予約