SnackBar在HTTPInterceptor中使用时不显示

时间:2018-10-19 17:32:36

标签: angular angular-material angular6 snackbar

我正在尝试编写一个全局HTTP拦截器,该拦截器拦截所有HTTP响应,检查响应,并(如果满足某些条件)显示一个小吃栏。

我似乎无法让小吃店展示出来。如果在.open()行上放置一个断点,我会看到小吃栏出现片刻,但没有任何文本且偏离中心。

拦截器:

import { Injectable, Injector, NgZone } from '@angular/core';
import {    
    HttpEvent,
    HttpHandler,
    HttpInterceptor,
    HttpRequest,
    HttpResponse,
} from '@angular/common/http';
import { Observable, of } from 'rxjs';
import { tap } from 'rxjs/operators';

import { MatSnackBar } from '@angular/material';
//import { of } from 'rxjs/observable/of';

@Injectable()
export class TMCErrorHttpInterceptor implements HttpInterceptor {
    constructor(public snackBar: MatSnackBar,private injector: Injector, private zone: NgZone){}
    /**
      * @param HttpRequest<any> request - The intercepted request
      * @param HttpHandler next - The next interceptor in the pipeline
      * @return Observable<HttpEvent<any>>
      */
    intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        const started = Date.now();
        return next.handle(request)
            // add error handling
            .pipe(
                tap(event => {
                    if (event instanceof HttpResponse) {                        
                        if (this.isError(event.body)){
                            this.handleError(event.body);                                          
                        }
                    }
                }, error => {
                    console.error('NICE ERROR', error)
                })
            );
    }
    isError(response: any): any {
        return (typeof (response) == "object"
            && typeof (response.MESSAGE) != "undefined"
            && typeof (response.STATUS) != "undefined"
            && typeof (response.CODE) != "undefined"
            && response.STATUS === "error"
        );
    }
    handleError(error: any): any {
        this.snackBar = this.injector.get(MatSnackBar);
        this.zone.run(() => {
            this.snackBar.open("hiiiiii");
          });
    }
}

我尝试取出区域,而不使用注射器。没有变化。

1 个答案:

答案 0 :(得分:-1)

所以我以某种方式偶然发现了答案,克隆请求使小吃店能够正常工作。奇怪。

我理解从可修改性/可链接性的角度克隆请求的必要性,但是要影响小吃店,需要比我有更好的头脑来解释。

因此,总而言之,对于那些徘徊在树林里这个陌生的尼克的人来说,将此行添加到拦截()函数的顶部即可使它起作用:

request = request.clone();