我正在将Angular2应用程序从2.0.0升级到2.3.0,我遇到了以下错误.你知道为什么吗?我看到了另一篇帖子(Angular 2.0.1 Router EmptyError: no elements in sequence篇),但在try 了这个之后,问题仍然存在.是什么导致了这个错误?

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

我还注意到,当我试图切换到使用警卫的路由时,会抛出NavigationError对象.但只有上面的错误显示在控制台中.

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

我有点不知所措,非常感谢您的帮助.

推荐答案

在我的例子中,当我在一个Observable中使用first()时,在first()之前emits 了takeUntil().

Example:

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);

很难发现问题,因为我在一个服务中返回了一个observabletakeUntil(),该服务由另一个调用first()的类(在另一个文件中)使用,错误是在页面导航过程中收到的(因为takeUntil()收到了在上一个页面被 destruct 时发出的observable),而且似乎问题出在导航本身.

最奇怪的是,错误发生在调用next()时,而不是发生在subscribe()的第二个参数中,从而导致导航过程本身失败.我不知道这个特性是否是rxjs团队 Select 的行为方式,因为它使隔离问题变得更加困难,而且主要问题是the producer receives an error because of something done by a consumer,这在我看来是一个糟糕的设计.

根据this comment:

.first()将只发出一个项目或抛出一个错误[…]如果你想从可观测数据中最多得到一项,请使用.take(1).

Update (2020-08-31)

似乎可以通过包含第二个参数来处理错误,以便在订阅中接收错误,如以下情况:

const test$ = new ReplaySubject(1);
const testAux$ = new ReplaySubject(1);
const test2$ = test$.asObservable().takeUntil(testAux$.asObservable());
test2$.first().subscribe(() => console.log('first!'), () => console.log('first error'));
testAux$.subscribe(() => console.log('another'), () => console.log('another error'));
console.log('1');
testAux$.next(null);
console.log('2');

记录如下:

1
first error
another
2

(在本例中,您不会看到No elements in sequence错误)

但是如果你想最多收到1件(但还是没有收到),那么take(1)件仍然是更好的方法,这也是我默认推荐的,而不是first()件.

Angular相关问答推荐

无法执行CanDeactivateFn Karma Test Angular 16

Angularmaterial 中的处理mat—radio—button表单值访问器

带有两个注入服务的函数式解析器(Angular 15)

更改图表上的光标以进行zoom

在Angular 多选下拉菜单中实现CDK拖放排序的问题

从、管道和映射可观察到的逻辑?

如何从URL中角下载图片?

我应该对我想要在我的Angular 17+组件中显示的任何变量使用信号吗?

Angular 路由中的模块构建失败

Angular 13 - 使用 PUT 时出现 400 错误(错误请求)

模块内的命名路由出口 - 路径匹配但内容未加载

iss 声明无效 Keycloak

关闭 Dynamsoft Web Twain 弹出窗口

如何设置Angular 4背景图片?

如何在 Angular4 中访问组件的 nativeElement?

无法获得 angular-material md-sidenav 的 100% 高度

在同一个组件中使用 MatSort 的多个 mat-table

angular2:错误: TypeError: Cannot read property '...' of undefined

angular 2模板使用console.log

如何在 Angular 应用程序中通过路由更改页面标题?