HttpInterceptor вызывает ExpressionChangedAfterItHasBeenCheckedError при закрытии MatDialog на канале дескриптора

У меня есть счетчик в компоненте диалогового окна, который я хочу отобразить до и после выполнения HTTP-запроса, диалоговое окно открывается и закрывается, как ожидалось, но он всегда выдает ошибку ExpressionChangedAfterItHasBeenCheckedError в ответе на запрос, который я перехватываю в handle.pipe.

@Injectable()
export class ApiHttpInterceptor implements HttpInterceptor {
  constructor(private router: Router, private sessionService: SessionService, private dialog: MatDialog) {}

  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    const spinner = this.dialog.open(SpinnerDialogComponent, {
      disableClose: true,
      autoFocus: true,
      width: '150px',
      height: '150px',
      panelClass: 'spinner'});

      ...

      const authReq = req.clone({ headers: headers});

      return next.handle(authReq).pipe(tap(
        (event: HttpEvent<any>) => {
          if (event instanceof HttpResponse) {
            spinner.close();
          }
          return event;
        }));
  }
}

Я работаю с angular6

Как я могу это исправить?