angular2/4 有没有loading-bar的插件？或者怎么监听页面一有http请求就能出现动画

Question

自己写了一个loading-bar插件，不过都是手动调用和关闭，每个http请求都得手动添加自定义插件，想问问有没有人用过好用的loading-bar，只要调用一次，就能全局监听http请求，当用户网络不太好的时候就会有加载的动画出现？谢谢！

Answer 1

查了一些资料后在http加入了监听，放在 https://github.com/ChenJunhan...上了

Answer 2

这种问题你应该去github搜。肯定能搜出来。帮你搜了个。https://github.com/akserg/ng2...

Answer 3

随便去npm上搜索，你可以把loading-bar封装到Http请求中。

Answer 4

题主，您好，
本人也是采用 @mafeifan 同学 提到的那个插件。以下是我自己的实践，希望能有所帮助。
app.component.ts如下：

import { Component, OnDestroy } from '@angular/core';
import { SlimLoadingBarService } from "ng2-slim-loading-bar";
import { NavigationCancel, NavigationEnd, NavigationError, NavigationStart, Router } from "@angular/router";

@Component({
  // tslint:disable-next-line
  selector   : 'body',
  templateUrl: './app.component.html'
})
export class AppComponent implements OnDestroy {
  private sub: any;

  constructor(private slimLoader: SlimLoadingBarService, private router: Router) {
    // Listen the navigation events to start or complete the slim bar loading
    this.sub = this.router.events.subscribe(event => {
      if (event instanceof NavigationStart) {
        this.slimLoader.start();
      } else if (event instanceof NavigationEnd ||
        event instanceof NavigationCancel ||
        event instanceof NavigationError) {
        this.slimLoader.complete();
      }
    }, (error: any) => {
      this.slimLoader.complete();
    });
  }

  ngOnDestroy(): any {
    this.sub.unsubscribe();
  }
}