# Displaying Loading Indicator

## Environment

<table>
    <tbody>
	    <tr>
	    	<td>Product</td>
	    	<td>Progress® Kendo UI Angular</td>
	    </tr>
    </tbody>
</table>

## 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](https://www.telerik.com/kendo-angular-ui-develop/components/indicators/loader)—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](https://www.telerik.com/kendo-angular-ui-develop/components/grid/data-binding/remote-data#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.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/knowledge-base/implement-loading-indicator/source.txt)