我会和@ HendrikBrummermann一起回答:放置一个“Loading ...”标记。
从您的评论,“......这些组件包括头...显示头的无样式的HTML”,我相信你已经有了答案:有没有CSS加载的样式化的标题的HTML尚未。
亨德里克的回答使标签保持最小,所以这种效果不明显。
如果您确实需要立即设置标题的样式,我担心您需要使用内联样式(并且没有图片或字体 - 这些样式也不会被加载)。保持最低限度是所有的:
<!doctype html>
<html>
<head>
...
<style>
...
</style>
</head>
<body>
<app-root>(styled header)</app-root>
</body>
</html>
然后加载后,您可以删除占位符。
你也可以尝试一下两个“加载器”的增量方法:一个非常,最小的需要紧靠没有CSS /图像,然后尽快字体和其他很少基本资产onLoad'ed你可以用一个简单的动画替换它,然后从那里加载所有其余的并激活完整的Angular应用程序。
还有“打包器”工具,可将大多数HTML,CSS和JS压缩为单个缩小的SPA包;其中一些(我很抱歉,我看到其中有几个使用过,但从未用过我自己也无法引用它们)也提供了如上所述的最小加载程序。这可能照顾你的一些维修,这也许值得一试。我知道这是因为对于一个项目,我的一位同事必须用HTML5替换Flash“Please wait”加载器(这不是一个Angular项目,但我认为它不重要)。
我想要一个更令人满意的答案,所以我提高了你的问题。 – Kellen
只要你知道,你所描述的就是FOUC--无风格内容的Flash。 – Pytth