Angular 预引导(第一个屏幕)加载器的动画在初始加载期间卡住

Question

此处为简单演示:https://plnkr.co/edit/IA0Bs5VH9WwVbLlKPQ6X?p=preview (我使用的是官方的 angular.io/docs 演示应用)

问题是:第一个屏幕加载器(我使用 loader.svg)动画在 Angular 应用程序的初始加载期间卡住了一秒钟

过程是这样的:打开页面，svg loader 动画开始 -> loader animation freezes -> loader 动画重新启动 -> angular app 完成加载，loader 隐藏

在此演示中，卡住更加明显:http://iarouse.com/dist-angular2-material/v1/

<my-app>
  <!-- the loader -->
  <div id="loader-container"></div>
</my-app>

我的真实应用更大，初始加载器动画在引导过程中卡住了几秒钟，这令人沮丧

我能做些什么来让它变得顺利吗？

Answer 1

我遇到了你的问题，因为我正在渲染一个 gif 旋转器图像。我尝试了@bviale 发布的解决方案，它奏效了。

简单地使用了https://www.w3schools.com/howto/howto_css_loader.asp中创建的代码并放在 app-root 标签之间。