After change grid refresh progress image, image not auto disappear

[lorryl]

Hi,

I want to change the grid progress image, follow the code , but the image will not auto disappear.

Please help me. 

dataBound() {

    var progressElements: any = [];

    progressElements = this.grid.element.querySelectorAll('.e-spinner-inner');

    if (progressElements && progressElements.length > 0) {

      progressElements[0].innerHTML =

        "<img src='https://icon-library.com/images/progress-icon-gif/progress-icon-gif-1.jpg'/>";

    }

  }

[lorryl]

https://stackblitz.com/edit/angular-vtbfnq?file=app.component.ts

[Thiyagu Subramani]

Hi lorryl, 

Greetings from Syncfusion support. 

Based on your shared information we suspect that you want to customize spinner image as per your needs. For this we suggest you to use custom templates on the Spinner instead of the default showing Spinner using the setSpinner method. This already discussed in our Documentation as given below. Please refer it. 

Documentation: https://ej2.syncfusion.com/documentation/spinner/template/ 

In below code example, we have bound the image on Grid component instead of default spinner. Please refer the below code example and sample for more information. 

ngOnInit(): void { 

    this.data = new DataManager({ 

      url: "https://services.odata.org/V4/Northwind/Northwind.svc/Orders/", 

      adaptor: new ODataV4Adaptor() 

    }); 

    setSpinner({ 

      template: 

        '<img src="https://icon-library.com/images/progress-icon-gif/progress-icon-gif-1.jpg" class="custom-rolling"></img>' 

    }); 

  } 

.custom-rolling { 

  width: 200px !important; 

  height: 200px !important; 

} 

Sample link: https://stackblitz.com/edit/angular-vtbfnq-bwwkqr?file=app.component.ts 

Note: Spinner image disappearing  perfectly. 

 

Please get back to us, if you need any further assistance. 

Regards, 

Thiyagu S