Angular 如何在进行角度解析器时添加加载程序gif

在服务器调用解析程序时，是否可以在页面上添加加载程序gif？解析程序在许多页面上，所有加载程序gif都是相同的，那么有没有一种全局方法来实现这一点，而不是在每个模板上添加代码

可以订阅路由更改事件：

router.events.subscribe(evt => {
    if (evt instanceof NavigationStart) {
        // Do what you need to here
    }
});

---

但我不知道该把这个放在哪里。至于全局加载程序gif，可能根组件可以由解析程序访问？

将其放在应用程序组件或由应用程序引导的主组件上

import { Router, NavigationStart, NavigationEnd, NavigationError, NavigationCancel, RoutesRecognized } from '@angular/router';
loading = false;
constructor(router:Router) {
  router.events.forEach((event) => {
    if(event instanceof NavigationStart) {
    }
    // NavigationEnd
    // NavigationCancel
    // NavigationError
    // RoutesRecognized
  });
}

将此添加到app.component模板

<div *ngIf ="loading" class ="main">
  <div class="spinner">
    <div class="rect1"></div>
    <div class="rect2"></div>
    <div class="rect3"></div>
    <div class="rect4"></div>
    <div class="rect5"></div>
  </div>
</div>

现在，当路由器解析正在进行时，使用路由器解析来显示微调器

---

您可以在此应用程序中找到工作示例。它使用延迟加载和路由器解析来加载数据并显示此微调器。

将其放在应用程序组件或应用程序引导的主组件上

import { Router, NavigationStart, NavigationEnd, NavigationError, NavigationCancel, RoutesRecognized } from '@angular/router';
loading = false;
constructor(router:Router) {
  router.events.forEach((event) => {
    if(event instanceof NavigationStart) {
    }
    // NavigationEnd
    // NavigationCancel
    // NavigationError
    // RoutesRecognized
  });
}

将此添加到app.component模板

<div *ngIf ="loading" class ="main">
  <div class="spinner">
    <div class="rect1"></div>
    <div class="rect2"></div>
    <div class="rect3"></div>
    <div class="rect4"></div>
    <div class="rect5"></div>
  </div>
</div>

现在，当路由器解析正在进行时，使用路由器解析来显示微调器

---

您可以在此应用程序中找到工作示例。它使用延迟加载和路由器解析来加载数据并显示此微调器。

我认为，除了向每个模板添加代码之外，没有其他方法。在http提供程序周围创建一个包装器，然后从那里开始。然后你的模板可以在你的包装上做一个

*ngIf

，我不认为，除了向每个模板添加代码之外，还有其他方法。围绕http提供程序创建一个包装，然后从那里开始。然后你的模板可以在你的包装上做一个

*ngIf

，我不知道为什么你的问题是dv。我不知道为什么你的问题是dv。本不该如此