Issue with loading icon in angular material design


I am using angular material design and angularjs frameworks in my application.I am showing loading icon when a service/function is called in the page/screen.In desktop web browser i will get cursor icon (spinning) along with loading icon when a service/function is called.The loading icon disapears after 5 to 10 seconds once it gets data which is working fine but the problem is cursor icon (spinning) stays on the screen and will not change to normal cursor until we physically move the cursor.How could I change cursor icon (spinning) to normal cursor (arrow) after loading icon disappears (fetching data is completed) automatically.

I currently have the flooiwng code

<md-progress-circular class="md-hue-2 md-busy" md-mode="indeterminate" style="margin:auto"></md-progress-circular>

I wonder; is it possible to detect when it finishes in Angular and apply a class to the body element which forces cursor:pointer? I’m not sure if that will work because the browser might need that movement to refresh what it’s supposed to do. I wouldn’t get your hopes up.

Thank you for your response.But the problem is the cursor icon continuously spins until any user interaction. So can we make cursor icon not to spin with loading icon .I made cursor to default but it’s not working ie.cursor icon spins along with loading icon.

padding-top:0 !important;
margin-botton:0 !importan;


This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.