Angular Pivot Grid 一括編集とトランザクション

    以下は、Pivot Grid コンポーネントに対して一括編集を有効にする方法の詳細な例です。

    Angular Pivot Grid 一括編集とトランザクションの例

    以下のサンプルは、pivotGrid にプロバイダーのトランザクションがあり、batchEditing と行編集が有効にされています。行編集全体を確定後にトランザクションが追加されるようにします。

    Note

    トランザクション ステートは、すべての更新、追加、削除された行、そして最後のステートで構成されます。

    使用方法

    IgxPivotGridModule を app.module.ts ファイルにインポートします。

    // app.module.ts

...
import { IgxPivotGridModule } from 'igniteui-angular';

@NgModule({
    ...
    imports: [..., IgxPivotGridModule],
    ...
})
export class AppModule {}

    次に、Pivot Grid から batchEditing を有効にします。

    <igx-pivot-grid [data]="data" [batchEditing]="true">
  ...
</igx-pivot-grid>

    これにより、igx-pivot-grid に Transaction サービスの適切なインスタンスが提供されます。適切な TransactionService は TransactionFactory を通じて提供されます。この内部実装の詳細については、トランザクション トピックを参照してください。

    一括編集を有効にした後、バインドされたデータ ソースと rowEditable を true に設定して IgxPivotGrid を定義し、バインドします。

    Note

    トランザクション API は編集の終了を処理しないので、自分で行う必要があります。そうしないと、Pivot Grid は編集モードのままになります。これを行う 1 つの方法は、それぞれのメソッドで endEdit を呼び出すことです。

    Note

    rowEditable プロパティを無効にすると Pivot Grid を変更してセル変更でトランザクションを作成し、UI で行編集オーバーレイを公開しません。

    API リファレンス

    その他のリソース

    コミュニティに参加して新しいアイデアをご提案ください。