オブジェクトのキーはフィールド名を表し、値はそのデータをどのように型変換するかを示すDataType 値を表します。以下のサンプルコードは、 ODataCollectionView を作成した後、（データベースに文字列として格納されている）'Freight'の値を数値に変換し、さらに3つの日付フィールドを日付に変換します。

import { ODataCollectionView } from '@grapecity/wijmo.odata';
var orders = new ODataCollectionView(url, 'Orders', {
  dataTypes: {
    Freight: wijmo.DataType.Number
    OrderDate: wijmo.DataType.Date,
    RequiredDate: wijmo.DataType.Date,
    ShippedDate: wijmo.DataType.Date,
  }
});

このプロパティは、データベースに格納されているデータの書式が一般的な用法に適合していない場合に役立ちます。 inferDataTypes プロパティによってDate値の変換が自動的に処理されるため、ほとんどの場合、データ型に関する情報を提供する必要はありません。 明示的に型情報を提供した場合、inferDataTypes プロパティは適用されません。 そのため、データ型の情報を提供する場合は、Date型のフィールドも含め、 すべてのフィールドの型情報を提供する必要があります。

このプロパティは直接ODataの$expandオプションにマップされます。

たとえば、次のコードは、すべての顧客とその注文をデータベースから取得します。 各顧客エンティティには、注文オブジェクトの配列を含む[Orders]フィールドが含まれています。

var url = 'http://services.odata.org/Northwind/Northwind.svc';
var customersOrders = new wijmo.odata.ODataCollectionView(url, 'Customers', {
  expand: 'Orders'
});

このプロパティがnullまたは空の配列に設定されている場合は、 すべてのフィールドが 取得されます。

たとえば、以下のコードは、データベースの'Categories'テーブルから3つの フィールドのみを取得する ODataCollectionView を作成します。

import { ODataCollectionView } from '@grapecity/wijmo.odata';
var categories = new ODataCollectionView(url, 'Categories', {
  fields: ['CategoryID', 'CategoryName', 'Description']
});

このコールバック関数がtrueを返した場合、 パラメーターとして渡された項目はビューに含まれます。

メモ: フィルタ関数でスコープ（すなわち、有効な'this'値）が必要な場合は、 'this'オブジェクトを指定した'bind'関数を使用してフィルタを設定します。 例:

  collectionView.filter = this._filter.bind(this);

フィルタ定義構文については、ODataドキュメントを参照してください。たとえば、以下のコードでは、 'CompanyName'フィールドが'A'で始まり'S'で終わるレコードがサーバーから返されます。

view.filterDefinition = "startswith(CompanyName, 'A') and endswith(CompanyName, 'B')";

フィルタ定義は自動生成することができます。 たとえば、FlexGridFilter コンポーネントは、データソースがODataCollectionView かどうかを検出し、 ODataCollectionView.filter プロパティとODataCollectionView.filterDefinition プロパティの両方を自動的に更新します。 ODataCollectionView.filterDefinition プロパティは、ODataCollectionView.filterOnServer プロパティがfalseに設定されている場合でも 適用されることに注意してください。 これにより、同じコレクションに対してサーバーフィルタとクライアントフィルタの両方を適用でき、 さまざまなシナリオで役立ちます。 たとえば、次のコードは、ODataCollectionView.filterDefinition プロパティを使用してサーバーでフィルタ処理を実行し、 ODataCollectionView.filter プロパティを使用してクライアントでさらにフィルタ処理を実行します。 結果のコレクションには、名前が'C'で始まり、単価が20より大きい項目が表示されます。

var url = 'http://services.odata.org/V4/Northwind/Northwind.svc/';
var data = new wijmo.odata.ODataCollectionView(url, 'Products', {
  oDataVersion: 4,
  filterDefinition: 'startswith(ProductName, \'C\')', // サーバー側のフィルタ
  filterOnServer: false, // クライアント側のフィルタ
  filter: function(product) {
    return product.UnitPrice > 20;
  },
});

ビューに含めるには、アイテムはfilterプロパティとfiltersコレクション内のすべての述語を渡す必要があります。

指定すると、コールバックは、検証する項目とプロパティを含む2つのパラメータを受け取り、 エラーを説明する文字列を返します（エラーがない場合はnull）。

次に例を示します。

import { CollectionView } from '@grapecity/wijmo';
var view = new CollectionView(data, {
    getError: function (item, property) {
        switch (property) {
            case 'country':
                return countries.indexOf(item.country) < 0
                    ? 'Invalid Country'
                    : null;
            case 'downloads':
            case 'sales':
            case 'expenses':
                return item[property] < 0
                    ? '負にはできません。'
                    : null;
            case 'active':
                return item.active && item.country.match(/US|UK/)
                    ? 'USまたはUKではアクティブな項目が許可されません'
                    : null;
        }
        return null;
    }
});

ODataCollectionView クラスは、DateオブジェクトをサポートしていないJSON形式を 使用するため、 このプロパティはデフォルトでtrueに設定されます。

dataTypes プロパティを使用して特定のタイプ情報を指定する場合、このプロパティは無効になります。

このプロパティを使用して、進捗状況インジケータを提供できます。

提供されている場合、関数は2つのパラメータ（キーおよび値）があり、 解析された値（元の値と同じ値の場合があります）を返さなければなりません。

reviver関数の詳細については、JSON.parse methodを参照してください。

更新操作（追加/削除/完全削除）にはキーフィールドが必要です。

作成関数が提供されない場合、CollectionView は、適切な型の項目を 初期化せずに作成しようとします。

作成関数が提供される場合、その関数は、パラメータを受け取らず、 コレクションに対して適切な型のオブジェクトを初期化して返す 必要があります。

現在、ODataサービスには1.0～4.0の4つのバージョンがあります。 最新サービスではバージョン4.0が使用されていますが、 レガシーサービスも依然として数多く運用されています。

利用するサービスが実装しているODataのバージョンがわかっている場合は、 ODataCollectionView を作成するときに、 oDataVersion プロパティを適切な値（1～4）に設定します（以下の例を参照）。

var url = 'http://services.odata.org/Northwind/Northwind.svc';
var categories = new wijmo.odata.ODataCollectionView(url, 'Categories', {
  oDataVersion: 1.0, // レガシーODataソース
  fields: ['CategoryID', 'CategoryName', 'Description'],
  sortOnServer: false
});

利用するサービスが実装しているODataのバージョンがわからない場合 （おそらく、 ODataエクスプローラアプリケーションを記述している場合）には、 バージョンは指定しないでください。 その場合、 ODataCollectionView この情報をサーバーから取得します。この操作には追加のリクエストが必要ですが、 サービスURLあたり1回だけなので、オーバーヘッドは大きくありません。

このプロパティはデフォルトで true に設定されます。これにより、 編集が完了した後にコレクションが常に正しくソート、フィルタリング、およびグループ化されるようにします。

false に設定する場合、アイテムの編集時に更新を遅延されます。 この場合、ソート、フィルタリング、およびグループ化の基準が変更されるか、 またはExcelと同様にrefresh メソッドが呼び出されるまで、コレクションは更新されません。

このプロパティは、認証が必要なシナリオでよく使用されます。 次に例を示します。

import { ODataCollectionView } from '@grapecity/wijmo.odata';
var categories = new ODataCollectionView(serviceUrl, 'Categories', {
  fields: ['Category_ID', 'Category_Name'],
  requestHeaders: { Authorization: db.token }
});

指定された場合、ソート比較関数は、パラメータとして任意の型の値を 2つ取り、最初の値が2番目の値と比べて小さい、等しい、または大きい のいずれであるかを示す値-1、0、または+1を返します。ソート比較関数がnullを返す場合は、標準の組み込み比較子が使用されます。

このsortComparer プロパティを使用すると、カスタム比較アルゴリズムを 提供でき、単純な文字列比較より、ユーザーが期待する結果によく 一致するソートシーケンスが得られる場合があります。

たとえば、 Dave Koele's Alphanum algorithmを参照してください。 このアルゴリズムは、文字列を文字列や数値から成る部分に分割した後、 数値部分は値順に、文字列部分はASCII順にソートします。 Daveは、この結果を「自然なソート順」と呼んでいます。

次の例は、sortComparer プロパティの一般的な使用方法を示します。

// カスタムソート比較子を使用してCollectionViewを作成します
var dataCustomSort = new wijmo.collections.CollectionView(data, {
  sortComparer: function (a, b) {
    return wijmo.isString(a) && wijmo.isString(b)
      ? alphanum(a, b) // 文字列に使用するカスタム比較子
      : null; // 文字列以外にはデフォルトの比較子を使用します
  }
});

次の例は、 Intl.Collator を使用してソート順を制御する方法を示しています。

// Intl.Collatorを使用してソートするCollectionViewを作成します
var collator = window.Intl ? new Intl.Collator() : null;
var dataCollator = new wijmo.collections.CollectionView(data, {
  sortComparer: function (a, b) {
    return wijmo.isString(a) && wijmo.isString(b) && collator
      ? collator.compare(a, b) // 文字列に使用するカスタム比較子
      : null; // 文字列以外にはデフォルトの比較子を使用します
  }
});

指定されている場合、この関数は、SortDescription、データ項目、および変換する値をパラメーターとして受け取り、 変換後の値を返す必要があります。

このプロパティはソートの動作をカスタマイズする手段を提供します。 たとえば、 FlexGrid コントロールはこのプロパティを使用して、 マップされた列を生の値ではなく表示値を基準にソートします。

以下のサンプルコードは、国コードの整数を含む'country'プロパティをソートするときに、 対応する国名を使用してソートされるようにします。

var countries = 'US,Germany,UK,Japan,Italy,Greece'.split(',');
collectionView.sortConverter = function (sd, item, value) {
  if (sd.property == 'countryMapped') {
    value = countries[value]; // 国IDを国名に変換します
  }
  return value;
}

このプロパティはデフォルトでfalseに設定されます。これにより、コレクションをソートするとNULL値が最後に表示されます。 この動作はExcelと同じです。

trackChanges がtrueに設定されている場合、CollectionView は、 データの変更を追跡し、itemsAdded、itemsRemoved、itemsEdited の 各コレクションを介して変更を公開します。変更の追跡は、変更が有効であることをユーザーが確認した後にサーバーを更新する必要がある場合に役立ちます。

変更をコミットまたはキャンセルしたら、clearChanges メソッドを使用して、 itemsAdded、itemsRemoved、itemsEdited の各コレクションをクリアします。 CollectionView は、適切なCollectionView メソッド（editItem /commitEdit、 addNew /commitNew、remove）を使用して行われた変更だけを追跡します。 データに直接行われた変更は追跡されません。

安定したソートアルゴリズムは、同じキーを持つレコード間の相対的な順序を維持します。 たとえば、"Amount"フィールドを持つオブジェクトのコレクションを考えてみます。 このコレクションを"Amount"でソートする場合、安定したソートでは、 Amount値が同じレコード間で元の順序が保たれます。

このプロパティのデフォルトは false です。この場合は、 高速だが安定ではないJavaScriptの組み込みソートメソッドが CollectionView で使用されます。

useStableSort をtrueに設定すると、すべてのブラウザーで安定したソートが保証されますが、ソート時間が30%～50%も長くなります。

注意：Chromeはバージョン70以降、Firefoxバージョン3以降は安定したソートを提供します。 ES2019の場合 、ソートは安定している必要があります。 ES2018までのECMAScript第1版では、不安定になることが許可されていました。