使用$http发送请求的时候显示loading

最新推荐文章于 2021-07-01 10:33:44 发布

excaliburace

最新推荐文章于 2021-07-01 10:33:44 发布

阅读量1.9k

点赞数

分类专栏： AngularJS 文章标签： angularjs http loading

本文链接：https://blog.csdn.net/Excaliburace/article/details/72817351

版权

在AngularJS单页应用中，为了在发送HTTP请求时显示加载指示器，可以在index.html中添加特定的CSS和JS代码。CSS部分用于创建loading效果，而JS部分则在$http请求前后控制loading的显示和隐藏。同时，可以使用Bootstrap的modal-open属性来实现页面的半透明蒙版，防止用户在加载期间进行交互。

摘要由CSDN通过智能技术生成

由于是单页应用, 所以在index.html中必有这样一行:

<div ui-view=""></div>

在这一行下面添加以下代码:

<div id="loading" ng-show="showLoading">
    <div class="spinner">
        <img src="images/loading.gif" style="z-index: 999">
    </div>
</div>

CSS:

#loading {
  position: fixed; /* Sit on top of the page content */
  display: block; /* Hidden by default */
  width: 100%; /* Full width (cover the whole page) */