EmptyError: нет элементов в последовательности при использовании takeWhile в угловом ограждении

Question

У нас есть защита canActivate, которая должна возвращать Observable (логическое значение).

Логическое состояние получено службой формы, в которой нам нужно опрашивать 3 раза с интервалом в 1 секунду, пока мы не получим ответ «true».

Проблема в том, что всякий раз, когда takeWhile возвращает false, мы получаем следующий код

error:
failure.service.ts:36 Error: Uncaught (in promise): EmptyError: no elements in sequence
EmptyError: no elements in sequence

ниже - код, который вызывает проблему.RXJS - версия ^ 6.2.1. Угловой интерфейс командной строки - версия ^ 6.0.8

import { repeat, delay, takeWhile, map } from 'rxjs/operators';
import { Injectable } from '@angular/core';
import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
import { AuthService } from '../services/auth.service';
import { Observable, of } from 'rxjs';

@Injectable()
export class AuthGuard implements CanActivate {

  constructor(private authService: AuthService) { }

  canActivate(_route: ActivatedRouteSnapshot, _state: RouterStateSnapshot): Observable<boolean> {
    return this.authService.isAuthenticated().pipe(
      delay(1000),
      repeat(3),
      takeWhile((authenticated: boolean) => {
        return !authenticated;
      })
    );
  }
}

Answer 1

Насколько я понимаю, EmptyError означает, что наблюдаемая, которая должна что-то испускать, завершена, не испуская ничего.Оператор takeWhile всякий раз, когда возвращает false, заставляет наблюдаемое ничего не излучать, что ожидает canActivate.

Я думаю, что вам нужно использовать оператор map вместо takeWhile:

canActivate(_route: ActivatedRouteSnapshot, _state: RouterStateSnapshot): Observable<boolean> {
return this.authService.isAuthenticated().pipe(
  delay(1000),
  repeat(3),
  map((authenticated: boolean) => {
    return !authenticated;
  })
);

}