Html boostrap容器在检索异步内容之前的最小高度

我使用angular5开发单页web应用程序，我使用bootstrap4进行页面布局

具有基本布局-页眉-正文-页脚

将动态数据（图像）检索到库中并放入body容器时出现问题。当用户被重定向到gallery页面时，一个异步请求被发送到数据库。同时，主体容器是空的，所以它的高度为零，用户可以看到页眉正上方的页脚

---

为包含异步内容的容器设置最小高度的最佳实践是什么？

将

加载类添加到包装div可能是一个好主意

HTML：

<div id="image-wrapper" class="loading">
</div>

然后，您可以向异步加载添加一个回调，该回调将添加加载的内容，并删除
加载
类。
例如，您可以向容器css添加一个
最小高度：500px
。
.loading {
    min-height:500px;
    background-image:url('img/loading-indicator.gif');
    background-position:center;
    background-repeat:no-repeat;
}