Displaying Loading Indicator

Environment

Product

Progress® Kendo UI Angular

Description

How can I implement a loading indicator to keep users informed of ongoing operations?

Solution

You can display a loading indicator by either using:

• Loader Component—Offers various loader types, animations, and additional customization options.
• k-i-loading CSS class—Displays a single loader type with options for further customization using CSS.

For more information on using the built-in solution for rendering a loading indicator in the Grid, refer to the article on indicating ongoing data operations.

The following example demonstrates how to show a loading indicator using the k-i-loader CSS class. The class is applied on a custom container which is further position in the center with CSS styling.

Change Theme

Theme

Loading ...