web-dev-qa-db-fra.com

EmptyError: aucun élément en séquence

Je suis en train de mettre à jour mon application Angular2 de la version 2.0.0 à la version 2.3.0 et je rencontre l'erreur suivante. Une quelconque idée du pourquoi? J'ai vu cet autre article ( Angular 2.0.1 Router EmptyError: aucun élément en séquence ), mais après avoir essayé cela, le problème persiste. Qu'est-ce qui cause cette erreur?

Error: Uncaught (in promise): EmptyError: no elements in sequence
Error: no elements in sequence
    at EmptyError.ZoneAwareError (zone.js:672)
    at new EmptyError (EmptyError.ts:13)
    at FirstSubscriber._complete (first.ts:161)
    at FirstSubscriber.Subscriber.complete (Subscriber.ts:122)
    at Subject._subscribe (Subject.ts:109)
    at Subject.Observable.subscribe (Observable.ts:98)
    at Observable._subscribe (Observable.ts:158)
    at Observable.subscribe (Observable.ts:98)
    at Observable._subscribe (Observable.ts:158)
    at FirstOperator.call (first.ts:82)
    at Observable.subscribe (Observable.ts:96)
    at Object.subscribeToResult (subscribeToResult.ts:32)
    at MergeAllSubscriber._next (mergeAll.ts:82)
    at MergeAllSubscriber.Subscriber.next (Subscriber.ts:95)
    at MapSubscriber._next (map.ts:80)
    at resolvePromise (zone.js:475) [angular]
    at resolvePromise (zone.js:460) [angular]
    at /libs/zone.js/dist/zone.js:509:17 [angular]
    at Object.onInvokeTask (core.umd.min.js:32) [angular]
    at ZoneDelegate.invokeTask (zone.js:261) [angular]
    at Zone.runTask (zone.js:151) [<root> => angular]
    at drainMicroTaskQueue (zone.js:405) [<root>]
    at ZoneTask.invoke (zone.js:336) [<root>]ErrorHandler.handleError @ core.umd.min.js:31next @ core.umd.min.js:32generatorOrNext.object.schedulerFn @ core.umd.min.js:32SafeSubscriber.__tryOrUnsub @ Subscriber.ts:238SafeSubscriber.next @ Subscriber.ts:190Subscriber._next @ Subscriber.ts:135Subscriber.next @ Subscriber.ts:95Subject.next @ Subject.ts:61EventEmitter.emit @ core.umd.min.js:32NgZone.triggerError @ core.umd.min.js:32onHandleError @ core.umd.min.js:32ZoneDelegate.handleError @ zone.js:233Zone.runGuarded @ zone.js:129_loop_1 @ zone.js:416drainMicroTaskQueue @ zone.js:425ZoneTask.invoke @ zone.js:336

J'ai également remarqué qu'un objet NavigationError est renvoyé lorsque j'essaie de passer à un itinéraire utilisant des gardes. Mais seule l'erreur ci-dessus correspond à ce qui est affiché dans la console.

NavigationError {id: 2, url: "/home", error: EmptyError}

Je suis un peu perdue et j'apprécierais toute aide.

angularangular2-routing
34
hartpdx

Cette erreur se produit lors de l’utilisation de RxJS 5.5.3 avec angular (version 4/5), il suffit donc d’ignorer RxJS 5.5.3 et d’utiliser RxJS 5.5.4 en ajoutant "rxjs": "^5.5.4" à votre projet package.json.

Avant que RxJS 5.5.4 soit sorti, répondez: (ancien, ne le faites pas)

  • Verrouiller la version 5.5.2 RxJS sur package.json source
  • add pathMatch: 'complet' sur les chemins vides source

Il semble que ceci soit un problème RxJS qui devrait être corrigé très bientôt. source

76
golfadas

Dans mon cas, j'ai ces erreurs lorsque j'ai utilisé first() dans un Observable dont un takeUntil() avait été émis avant first().

Exemple: 

let test$ = new ReplaySubject(1);
let testAux$ = new ReplaySubject(1);
let test2$ = test$.asObservable().takeUntil(testAux$.asObservable());
test2$.first().subscribe(() => console.log('first!'));
testAux$.next(null);

Il était difficile de découvrir le problème car j'ai renvoyé un observable avec takeUntil() dans un service utilisé par une classe différente (dans un autre fichier) appelée first(). , et l’erreur a été reçue pendant la navigation de la page (parce que takeUntil() a reçu un observable émis lors de la destruction de la page précédente), et il est apparu que le problème était lié à la navigation elle-même.

Le plus étrange est que l'erreur se produit lorsque la next() est appelée, et non dans le deuxième argument de subscribe(), ce qui entraîne l'échec du processus de navigation. Je ne sais pas si cette fonctionnalité a été choisie par l'équipe de rxjs pour se comporter de cette manière, car il est beaucoup plus difficile d'isoler le problème.

Selon ce commentaire :

D'abord émettra exactement un élément ou émettra une erreur [...] Si vous souhaitez obtenir au plus un élément de l'observable, utilisez .take(1).

27
Lucas Basquerotto

Vous avez besoin de changement pour:

canActivate(route: ActivatedRouteSnapshot): Observable<boolean>{
   return new Observable<boolean>(resolve => {
      resolve.next(true);
      resolve.complete();
  });
}

=================

Je ne sais pas pourquoi, mais pour moi, cette erreur a été causée par les gardes de routeur CanActivate utilisant des observables. Le passage aux promesses a cependant résolu le problème.

Je suis passé de ceci:

canActivate(route: ActivatedRouteSnapshot): Observable<boolean>{
     return new Observable<boolean>(resolve => {

          resolve.complete(true);
        //or
          resolve.complete(false);

    });
}

pour ça:

canActivate(route: ActivatedRouteSnapshot){
     return true;
        //or
          return false;

    });
}
17
Victor96

Ajoutez cette propriété à votre itinéraire.

pathMatch: 'full

pour par exemple.

{ pathMatch: 'full', path: "", component: HomeComponent }

Cela a fonctionné pour moi.

7
knigalye

Avait le même problème parce que je faisais un .first () après un this.http.get (); Http.get renvoie un observable à froid, donc tout d'abord n'était pas nécessaire, car les observables à froid se désabonnent.

this.http.get (). pipe (first ()); -> EmptyError: aucun élément en séquence

4
The Segfault

J'ai eu ce problème dans Angular 6/RxJs 6 et a constaté que c'était à cause de ma garde ayant une redirection et complète juste après.

Avant:

if (!res) {
  this.router.navigate(['/']);
  observer.complete(); // <-- This was the offender
}

Après:

if (!res) {
  this.router.navigate(['/']);
}
1
Michael

Pour tous ceux qui venaient ici à cause du message d'erreur, cela nous arrivait parce que nous retournions un observable vide. Vous devez rendre au bail une valeur telle que "true".

return of(true);
1
despuestambien

Dans mon cas, avec la version 5.5.12 de rxjs, cela me posait problème dans un scénario CanActivate. Mais la solution pour moi a été très facile à la fin. J'ai changé mon code de

const guard: Subject<boolean> = new Subject<boolean>();

à

const guard: ReplaySubject<boolean> = new ReplaySubject<boolean>(1);

Appel

guard.next(...);
guard.complete();

plus tard. Cela a fait le tour. Donc, pas de première promesse ni de promesse dans mon scénario.

1
timtos