1

2 つの外部カスケード ドロップダウンを使用して、 ngTableでフィルター サポートを取得しようとしています。ドキュメントが示すように、filterOptions を更新しましたが、運が悪いようです。私を助けてください

$scope.tblInventory = new ngTableParams({
    page: 1,
    count: 10,
    filter: $scope.searchObjs,
}, {
    total: 0,
    getData: function ($defer, params) {
        inventoryService.getAllVehicles().then(function (data) {
            params.total(data.length);
            $defer.resolve(data.slice((params.page() - 1) * params.count(), params.page() * params.count()));
        });
    }
});

私のHtmlマークアップ

<select class="form-control" id="make" name="make" data-ng-model="searchObj.make"
        data-ng-disabled="!searchObj.makes"
        ng-options="make for make in makes">
    <option style="display:none" value="">Select a make</option>
</select>
<label>
    Model
</label>
<select class="form-control" id="model" name="model" data-ng-model="searchObj.model"
        data-ng-disabled="!searchObj.models"
        ng-options="model for model in models">
    <option style="display:none" value="">Select a model</option>
</select>


<table ng-table="tblInventory" class="table">
    <tr ng-repeat="item in $data">
        <td data-title="'Stock'">
            {{item.stockNumber}}
        </td>
        <td data-title="'Make'">
            {{item.make}}
        </td>
        <td data-title="'Model'">
            {{item.model}}
        </td>
    </tr>
</table>
4

1 に答える 1

2

ここには実際にはいくつかの問題があります。まず、searchObjビューで を参照しますが、スコープにアタッチされたオブジェクトは実際には と呼ばれsearchObjsます。第二に、実際には関数でフィルターを使用していませんgetData。したがって、 return from 内でinventoryService、次のようなフィルターを適用する必要があります。

      data = params.filter() ?
           $filter('filter')(data, params.filter()) :
           data;
      params.total(data.length);
      $defer.resolve(data.slice((params.page() - 1) * params.count(), params.page() * params.count()));

これが必要なことをするplnkrです。

考慮すべきもう 1 つのこと (ただし、これによってコードが機能しなくなるわけではありません) はinventoryService、フィルターが変更されるたびに呼び出すかどうかです。getDataフィルタが変更されるたびに呼び出されるため、外部のサービスからすべてのインベントリを取得し、getData内部でフィルタリング/ページングなどのみを実行することができますgetData

アップデート:

はい、サービスへの呼び出しをメインコントローラー関数に配置してから、約束の戻り値でデータと関数ngTableParams内を追加できます。thenこれを示す新しいplnkrを作成しました。

于 2014-09-05T17:33:00.210 に答える