Pagination in ListComponent

[rdkcentral]

Pagination in ListComponent

[erikhaandrikman]

Hi!
This is indeed possible, lets say we have a _handleRight() method:

_handleRight() {
    // first create a reference to the component
    const slider = this.tag("MySliderComponent");
    // store total amount of items
    const total = slider.items.length - 1;
    // grab the current index
    const index = slider.realIndex;

    // if we're still below the max item index
    // we let the list jump to the next item
    if (index < total) {
        slider.setNext();
    } else {
        // if not, we do so some api requests and end up with a
        // new set of items we want to attach to our list
        const nextSet = [
            {type: MyListItem, item:{title:'a'}},
            {type: MyListItem, item:{title:'b'}},
            {type: MyListItem, item:{title:'c'}},
            {type: MyListItem, item:{title:'d'}},
            {type: MyListItem, item:{title:'e'}}
        ];

        // we use the a() method on the item list
        // and feed it with an array, this will create and add
        // an component for every item in the array.
        slider.itemList.a(nextSet);

        // after the items are added we force the slider to jump
        // to the next item
        slider.setNext();
    }
}

Off course you want your app to be in a loading state when it's doing some async request for the next items (and block remote control input) but i think you can build it with this functionality in mind.

the itemList inherits members from the ObjectList, you can read more about available methods and their implementation here: https://github.com/WebPlatformForEmbedded/Lightning/blob/master/src/tree/ObjectList.mjs

[AndriyShpyra]

Thanks!

[erikhaandrikman]

No problem!