Docs

Virtual Scrolling

In ZingGrid, virtual scrolling is called infinite scrolling. This is a flexible performance feature that directly integrates with firebase in one line. The feature also works well with any remote API.

Infinite Scroll

Enable infinite scrolling by adding the height and page-size attributes to your <zing-grid> tag. Then add loadByScroll name attribute to <zg-param>.

  1. Add the height and page-size attributes to your <zing-grid> tag
<zing-grid height="400" page-size=10>
  1. Add adapter and src attributes to <zg-data>
<zg-data
  src="https://zinggrid-examples.firebaseio.com/movies"
  adapter="firebase"
>
  1. Add loadByScroll and name attributes <zg-param>
<zg-param
  name="loadByScroll"
  value="true">
</zg-param>

All together, it looks like this:

<zing-grid height="400" page-size=10>
  <zg-data src="https://zinggrid-examples.firebaseio.com/movies">
    <zg-param name="loadByScroll" value="true"></zg-param>
  </zg-data>
</zing-grid>
Top