We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Angular2 Grid Virtual Scrolling


I want a sample for Virtual Scrolling in Syncfusion Grid (using Angular2) not javascript, on-demand loading for adding rows at the event of scrolling.
Using a API method that takes the page number and returns only the records in this page.

Waiting for your response.

2 Replies

DA Dina Abdelbary July 5, 2017 09:14 AM UTC

Any updates, please?

SA Saravanan Arunachalam Syncfusion Team July 6, 2017 04:41 AM UTC

Hi Dina, 
Thanks for contacting Syncfusion’s support. 
Based on your requirement, we have created a sample that can be downloaded from the below link. 
In that sample, we have performed on-demand paging by enable virtualScrolling and please refer to the below code example. 
<ej-grid #grid  [dataSource]="gridData" [allowScrolling]=true  
                  [query] = "queryorder"> 
             . . .  
    public gridData = ej.DataManager({  
        url: "http://localhost:49339/Odata",  
        adaptor: new ej.ODataV4Adaptor()     
    public queryorder = new ej.Query().from('Orders');   
    . . . 
We have included angular2 sample also with in the project (EJGrid\angular2\ejGrid_Vpaging - Copy\ejGrid_Vpaging)  
Procedure for run the attached sample  
1)     Run the EJGRid Application and note down the LocalHost link (In our case, port number is 49339)  
2)     Run the Angular2 Application Separately   
3)     Use the EJGrid’s port number as Origin for the Angular2 Application and use them as shown below  
Saravanan A. 

Live Chat Icon For mobile
Up arrow icon