时间戳

首页 > 解决方案 > Angular如何在调用Web服务时禁用屏幕

angular - Angular如何在调用Web服务时禁用屏幕

问题描述

我是Angular的新手，这看起来像一个简单的问题，但是当我用谷歌搜索它时我找不到答案。当我调用一个需要几秒钟的网络服务时，我会显示一个微调器，但我希望所有的屏幕都是禁用（像灰屏 - 就像我在弹出消息中看到的那样）有什么想法吗？当我有多个组件时，我希望它也能正常工作

标签： angularangular-services

解决方案

您可以div在网站上放置 a 并对其应用以下 CSS。然后您可以使用 *ngIf 切换 if（在请求开始时将其设置为可见，并在完成后将其隐藏）：

<div class="disable-background" *ngIf="toggleLayer"></div>

.disable-background{
   position: fixed;
   top: 0;
   left: 0;
   background: #2d2d2d;
   opacity: 0.8;
   z-index: 998;
   height: 100%;
   width: 100%;
}

它的作用是在实际屏幕上方放置一个灰色层，有点透明。

推荐阅读