This is a migrated thread and some comments may be shown as answers.

Angular loading spinner

4 Answers 424 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Musashi
Top achievements
Rank 1
Musashi asked on 10 Jun 2017, 12:23 AM
How do you show a loading spinner? I see loading spinners on all the demo angular components, but no documentation.

4 Answers, 1 is accepted

Sort by
0
Veselin Tsvetanov
Telerik team
answered on 13 Jun 2017, 07:49 AM
Hi Musashi,

In case you are developing an AngularJS application with Kendo UI jQuery widgets, you could use the kendo.ui.progress to indicate ongoing task (loading indicator) on the page.

In case you are developing an Angular 2+ application, the suite offers you a loader styling element:
<span class="k-i-loading k-icon" style="font-size: 64px;">

Keep in mind, that the loading indicator on the documentation examples is a custom one. The available k-i-loading loader could be seen in the following Plunker sample.

Regards,
Veselin Tsvetanov
Progress Telerik
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Yuriy
Top achievements
Rank 1
answered on 07 Mar 2018, 02:18 PM

Hi,

I couldn't find Kendo UI for Angular 2 specific forum, so I'll just ask here. Can you provide an example how to use Loading Indicator

&lt;span class="k-icon k-i-loading"&gt;&lt;/span&gt;

with Kendo Grid for Angular? I want to show it during grid data bind and dataStateChange event (page, sort and filter) as I re-bind Grid data source from the server api, not "slice and dice" on the client. I found a hint of "IsLoading" state on Custom Directive page, but nothing specific. Please assist.

Thank you,

-Yuriy

0
Svet
Telerik team
answered on 09 Mar 2018, 03:12 PM
Hi Yuriy,

Please check the following sample plunker demonstrating the desired behavior:

http://plnkr.co/edit/UpjTnjyWOB3VBUZtLxnd?p=preview
 
I hope this helps. Please let me know in case I can provide any further assistance for this case.

Regards,
Svetlin
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Yuriy
Top achievements
Rank 1
answered on 09 Mar 2018, 06:53 PM

Hi Svetlin,

Thanks you quick turn around on it. Works fine. I saw similar on approach on StackOverflow. I guess, I was expecting more "out-of-the-box" solution.

Cheers,

-Yuriy

 

Tags
General Discussions
Asked by
Musashi
Top achievements
Rank 1
Answers by
Veselin Tsvetanov
Telerik team
Yuriy
Top achievements
Rank 1
Svet
Telerik team
Share this question
or