Display Loading Icon or Loading Progress Bar using angularjs

Deadly 提交于 2019-12-13 12:29:18

问题


How to display the loading Icon or loading Progress bar using angularjs. I mean something like this which used in jquery $("body").addClass("loading");, $("body").removeClass("loading");, I saw some links for progress bar which is of like youtube loading bar but i don't want like that I want simple progress bar or loading iage or loading icon or loading bar which show bar moving from module to module, tabs to tabs. Is there any link or function which explain clearly how to use it.


回答1:


if you dont want to implement it yourself, below are few links.

angular-spinner or angular-sham-spinner

also read this BLOG which details how the spinner works with angularjs

EDIT as per comments

app.directive("spinner", function(){
return: {
restrict: 'E',
scope: {enable:"="},
template: <div class="spinner" ng-show="enable"><img src="content/spinner.gif"></div>
}
});

i havent tested the code but directive wont be more complex than this...




回答2:


View

<div ng-show="loader.loading">Loading</div>

Controller

$scope.loader.loading = true;  // false

Add this also on top of your controller

  $scope.loader = { 

              loading : false ,

             };

Show and hide loading bar



来源:https://stackoverflow.com/questions/22959449/display-loading-icon-or-loading-progress-bar-using-angularjs

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!