При использовании углового HttpInterceptor RxJS BehaviorSubject не обновляется должным образом - PullRequest
0 голосов
/ 07 ноября 2019

Я пытаюсь настроить HttpInterceptor в Angular 8, чтобы я мог предупреждать своих пользователей, когда внешний интерфейс не может достичь внутреннего конца. Я настроил его так:

@Injectable({ providedIn: "root" })
export class HttpErrorInterceptor implements HttpInterceptor {

    private errorCounterE = new BehaviorSubject(999);
    errorCounter1 = this.errorCounterE.asObservable();

    setErrorCounterE(ourvalue: number): void {
        console.log("setting value: " + ourvalue);
        this.errorCounterE.next(ourvalue);
    }


    intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        console.log("aaa: " + this.errorCounterE.getValue());

        return next.handle(request)
            .pipe(
                retry(1),
                catchError((error: HttpErrorResponse) => {                  

                    console.log("ccc: " + this.errorCounterE.getValue());
                    this.setErrorCounterE(this.errorCounterE.getValue() + 1);
                    console.log("ddd: " + this.errorCounterE.getValue());                    

                    return throwError(errorMessage);
                })
            )}}

с моими провайдерами app.module, настроенными так:

providers: [
        emailCallService,
        securityCallService,
        {
            provide: HTTP_INTERCEPTORS,
            useClass: HttpErrorInterceptor,
            multi: true
        }
    ],

Я звоню с простого нажатия кнопки сейчас, сзадний конец отключен (поэтому он наверняка выдаст ошибку) в классе компонентов, подобном следующему:

export class ActiveMachinesComponent implements OnInit {
  constructor(private ecs: emailCallService, private scs: securityCallService, private hei: HttpErrorInterceptor) {
    this.emailErrorCount = 54321;
  }

private emailErrorCount: number;

 ngOnInit() {   
    console.log("error counter is now..." + this.emailErrorCount);
    this.hei.errorCounter1.subscribe(ourcount => this.emailErrorCount = ourcount);
    console.log("error counter is now..." + this.emailErrorCount); 
  }


buttonpress(): any { 
    console.log("------------");
    this.hei.errorCounter1.subscribe(thatvalue => {
      this.emailErrorCount = thatvalue
    });
    let t = this.emailErrorCount;
    console.log(t);
    console.log("------------");

    //then call it
    this.ecs.checkEmailService().subscribe((result) => {
        [another component makes an http call here, returning an observable.] 
    })
}

При загрузке страницы ngInit работает, как и должно, печатая 54321, а затем 999. Нажатие первой кнопки вызывает печать 999 между линиями тире. Когда вызов возвращается к перехвату, значение в предложении catchError изменяется от 999 до 1000, как и должно быть.

Проблема в том, что, если я нажму кнопку второй раз, число, напечатанное между пунктирными линиями, снова будет 999, даже если в качестве первого шага перехвата будет напечатано «aaa: 1000». Я думаю, что это как-то связано с тем, что мой компонент-компонент получает отдельный экземпляр класса-перехватчика, но я подумал, что при условии, что в root предполагается решить эту проблему и сделать так, чтобы у всех был только один экземпляр, которым мог поделиться,

Моя конечная цель заключается в том, чтобы мой перехватчик ошибок подсчитывал различные типы различных ошибок, которые он видит (404, 403 и т. Д.), И предупреждал пользователя в разное время в зависимости от того, что он видел. Но я запускаю ngIf из моего класса компонентов, что означает, что мне нужно, чтобы мои счетчики ошибок были видны этому классу. Какие-либо предложения? Я настроил это полностью неправильно?

...