Filtering Angular-ui Scroll

Question

I am trying to implement infinity type scrolling on a simple grid. Html is like this:

<div class="text-center" style="background-color:#eee;">
    <H2 style="margin-top:0px;">Customer List</H2>
    <hr />
    Search: <input ng-model="customerVm.search" /> <br /> <br />

    <table class="table table-hover" ui-scroll-viewport style="height:500px;">
        <tbody>
        <tr ui-scroll="customer in customerVm.datasource" ng-model="customerVm.gridResult" "buffer-size="10">
                <td>
        </tbody>
    </table>
</div>

I want to filter what is in the grid based on the search box model, seems simple enough. I would normally just use the following with an ng-repeat

 <tr ng-repeat="customer in customerVm.datasource | filter:customerVm.search" ng-model="customerVm.gridResult" "buffer-size="10">
                <td>{{customer.customername}}</td>
            </tr>

However with the use of "ui-scroll" instead of ng-repeat I am getting an error

Expected uiScroll in form of '_item_ in _datasource_' but got 'customer in customerVm.datasource | filter:customerVm.search'

Am I missing something on how to filter the data using Angular-ui scroll? I see the line in the scroll lib that is causing the issue which throws an error if there is anything other then

item in datasource

This makes me think that filtering is not possible in Angular-ui scroll. Any ideas folks?

Answer 1

Filtering is unfortunately not yet possible in this way, as the error suggests. See "Parameters" in the Readme file. You could implement your own filter in the data source "get" function. See also the official examples.