2

I'm using aurelia's ui-virtualization library to create a table using virtual-repeat and infinite-scroll-next. Html looks something like this:

<table>
    <thead>
       ...
    </thead>
    <tbody>
        <tr virtual-repeat.for="item of items" infinite-scroll-next="getMore">
            ...
        </tr>
    </tbody>
</table>

This works great, except I have certain ui components and interactions that update what is in my list array. Once that has be updated, the infinite-scroll-next function (getMore()) is never called. I update something like this:

update() {
    let vm = this;
    vm.apiService.getData(vm.filterOption)
        .then(response => {
            vm.items = response.content.items;
        });
}

Where filterOptions are changed through the ui and apiService.getData() returns a promise from an http call. The data in the table updates correctly, but the infinite scroll is then broken.

Am I doing something wrong, or is this a bug in ui-virtualization?

Edit:

It appears there are some properties added to the array __array_observer__ and __observers__. Thinking overwriting the whole array and thus removing these properties might be causing the problem, I tried an approach where I just add or remove elements appropriately. This does not work either.

Edit:

It seems to fail if I leave fewer than 7 of the original elements in the array.

yammerade
  • 629
  • 8
  • 20
  • I filed a bug with `aurelia-ui-virtualization` here: https://github.com/aurelia/ui-virtualization/issues/103 – yammerade Feb 07 '17 at 12:07

0 Answers0