Data Loading Spinner

Data loading spinner is responsible to display a spinner on data table body while on data fetch operation, once after the success data retrieval process it will disappear and data will be displayed on the table body.

Loading spinner is very useful when on Server Side Basic Data Binding and Server Side Web Socket Data Binding operations. from enabling data loading spinner ornamentum will keep updates the end user that the data retrieval process is still going on and preventing affect to user experience negatively.

What You Will See

Sales Products

IDOrder Method TypeRetailer TypeProduct LineProduct TypeRevenueQuantityGross Margin
import { Component } from '@angular/core';

@Component({
  selector: 'app-data-loading-spinner-usage',
  templateUrl: './data-loading-spinner-usage.component.html'
})
export class DataLoadingSpinnerUsageComponent {
  public items: any[];
}

Basic Usage

Loading spinner can be enable by binding true to showLoadingSpinner property in table level of data table configuration, by default configuration property was in false state.

  <ng-data-table
    ...
    [showLoadingSpinner]="true">
  </ng-data-table

Please note to display the loading spinner, it is mandatory to enable showLoadingSpinner property and after enabling, you can bind a custom template into the data loading scenario if you prefer. for loading spinner templates please refer Loading Spinner Template section.

No Records Template
API Doc for Data Table Loading Spinner