Angular拦截器,运行传出请求结束后的代码

Angular interceptor, run code after the outgoing request is finished

我有一个简单的拦截器,它检查传出请求是否针对特定端点类型,在本例中为 eventsfavoriteevents

这几乎按预期工作。它做错的一件事是 this.dispatcher 在传出请求完成之前分派。

如何更改它以便先运行传出请求,然后再进行调度调用?

import {Injectable, Injector, Optional} from '@angular/core';

import {
  HttpRequest,
  HttpHandler,
  HttpEvent,
  HttpInterceptor
} from '@angular/common/http';

import {Observable} from 'rxjs/Observable';

import {AppConstants} from '@constants/app-constants.constant';
import {DispatcherService} from '@services/dispatcher.service';

@Injectable()

export class EventsInterceptor implements HttpInterceptor {

  constructor(private dispatcher: DispatcherService) {}

  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {

    const urls = [
      {requestType: 'PUT', snippet: '/events/'},
      {requestType: 'DELETE', snippet: '/events/'},
      {requestType: 'PUT', snippet: '/favoriteevents'},
      {requestType: 'DELETE', snippet: '/favoriteevents'}
    ];

    for (const url of urls) {

      if (req.method === url.requestType || url.requestType === null) {

        if (req.url.indexOf(url.snippet) !== -1) {
          this.dispatcher.dispatch({type: AppConstants.actions.refreshFavoriteEvents});
        }
      }
    }

    return next.handle(req);
  }
}

你可以试试

...
return next.handle(req).pipe( tap( () => {
    if (someCondition) this.dispatcher.dispatch(...);
}) );