如何以所有内容为中心显示md-progress-circular

Question

我想md-progress-bar在从服务器加载数据时使用.

虽然md-progress-bar显示,但我希望所有其他内容不可点击.此外,进度动画应显示在窗口的中心.

我尝试在我的模板中使用以下HTML:

<md-dialog style="background-color:transparent;box-shadow:none">
    <div layout="row" layout-sm="column" layout-align="center center" aria-label="wait">
    <md-progress-circular md-mode="indeterminate" ></md-progress-circular>
    </div>
</md-dialog>

但它闪烁并显示滚动条:

任何的想法？

Answer 1

您可能现在已经找到了解决方案,但如果没有,这就是原因:旋转圆是SVG元素,然后转换(用于旋转效果),就像在此图像上一样.

该转换使内部内容高度比旋转器本身的大小更高,因此您可以看到滚动条.

添加高度(在你的情况下70px应该没问题,但是这个值取决于微调器大小;添加额外的高度也不会对你隐藏你的md-dialog背景造成伤害)和div layout="row"应该修复它.

<md-dialog style="background-color:transparent;box-shadow:none">
    <div layout="row" layout-sm="column" layout-align="center center" aria-label="wait" 
         style="height:70px;">
    <md-progress-circular md-mode="indeterminate" ></md-progress-circular>
    </div>
</md-dialog>

我希望这会有所帮助.