angular - TypeError:在切换到 Angular 6 和 RxJS 6 后,预期流的无效对象
问题描述
切换到 Angular 6 后,我的异步验证器不再工作了。我使用这样的方法来消除请求:https ://github.com/angular/angular/issues/6895#issuecomment-329464982
我的代码如下所示:
// in register component
validateNicknameNotTaken(control: AbstractControl): Observable<any> {
return timer(600)
.pipe(
switchMapTo(this.service.isNicknameNotTaken(control.value)),
map(res => {
return res ? null : {nicknameTaken: true};
}),
take(1)
);
}
ngOnInit() {
//...
nickname: ['', [Validators.required, Validators.maxLength(20)], this.validateNicknameNotTaken.bind(this)]
//...
}
// in service
isNicknameNotTaken(nickname: string): Observable<boolean> {
return this.apollo
.use('public')
.query<{ isNicknameNotTaken: boolean }>({
query: isNicknameNotTakenQuery,
variables: {
nickname: nickname
},
fetchPolicy: 'no-cache'
})
.pipe(
map(result => result.data.isNicknameNotTaken)
);
}
但我收到以下错误:
TypeError: You provided an invalid object where a stream was expected. You can provide an Observable, Promise, Array, or Iterable.
这是完整的日志:
core.js:1598 ERROR TypeError: You provided an invalid object where a stream was expected. You can provide an Observable, Promise, Array, or Iterable.
at subscribeTo (subscribeTo.js:41)
at subscribeToResult (subscribeToResult.js:6)
at new ForkJoinSubscriber (forkJoin.js:154)
at Observable._subscribe (forkJoin.js:135)
at Observable.push../node_modules/rxjs/_esm5/internal/Observable.js.Observable._trySubscribe (Observable.js:176)
at Observable.push../node_modules/rxjs/_esm5/internal/Observable.js.Observable.subscribe (Observable.js:161)
at MapOperator.push../node_modules/rxjs/_esm5/internal/operators/map.js.MapOperator.call (map.js:51)
at Observable.push../node_modules/rxjs/_esm5/internal/Observable.js.Observable.subscribe (Observable.js:158)
at FormControl.push../node_modules/@angular/forms/fesm5/forms.js.AbstractControl._runAsyncValidator (forms.js:2637)
at FormControl.push../node_modules/@angular/forms/fesm5/forms.js.AbstractControl.updateValueAndValidity (forms.js:2606)
defaultErrorLogger @ core.js:1598
push../node_modules/@angular/core/fesm5/core.js.ErrorHandler.handleError @ core.js:1647
next @ core.js:4727
schedulerFn @ core.js:3712
push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.__tryOrUnsub @ Subscriber.js:253
push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.next @ Subscriber.js:191
push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber._next @ Subscriber.js:129
push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next @ Subscriber.js:93
push../node_modules/rxjs/_esm5/internal/Subject.js.Subject.next @ Subject.js:53
push../node_modules/@angular/core/fesm5/core.js.EventEmitter.emit @ core.js:3704
(anonymous) @ core.js:4084
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:388
push../node_modules/zone.js/dist/zone.js.Zone.run @ zone.js:138
push../node_modules/@angular/core/fesm5/core.js.NgZone.runOutsideAngular @ core.js:4021
onHandleError @ core.js:4084
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.handleError @ zone.js:392
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:191
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:496
ZoneTask.invoke @ zone.js:485
timer @ zone.js:2054
setTimeout (async)
scheduleTask @ zone.js:2075
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:407
onScheduleTask @ zone.js:297
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:401
push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask @ zone.js:232
push../node_modules/zone.js/dist/zone.js.Zone.scheduleMacroTask @ zone.js:255
scheduleMacroTaskWithCurrentZone @ zone.js:1114
(anonymous) @ zone.js:2090
proto.(anonymous function) @ zone.js:1394
hostReportError @ hostReportError.js:8
push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.error @ Subscriber.js:225
push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber._error @ Subscriber.js:132
push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.error @ Subscriber.js:106
push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber._error @ Subscriber.js:132
push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.error @ Subscriber.js:106
push../node_modules/rxjs/_esm5/internal/Observable.js.Observable._trySubscribe @ Observable.js:183
push../node_modules/rxjs/_esm5/internal/Observable.js.Observable.subscribe @ Observable.js:161
push../node_modules/rxjs/_esm5/internal/operators/map.js.MapOperator.call @ map.js:51
push../node_modules/rxjs/_esm5/internal/Observable.js.Observable.subscribe @ Observable.js:158
push../node_modules/@angular/forms/fesm5/forms.js.AbstractControl._runAsyncValidator @ forms.js:2637
push../node_modules/@angular/forms/fesm5/forms.js.AbstractControl.updateValueAndValidity @ forms.js:2606
push../node_modules/@angular/forms/fesm5/forms.js.FormControl.setValue @ forms.js:3044
updateControl @ forms.js:1765
(anonymous) @ forms.js:1750
push../node_modules/@angular/forms/fesm5/forms.js.DefaultValueAccessor._handleInput @ forms.js:784
(anonymous) @ RegisterComponent.html:30
handleEvent @ core.js:11107
callWithDebugContext @ core.js:12204
debugHandleEvent @ core.js:11907
dispatchEvent @ core.js:8561
(anonymous) @ core.js:9005
(anonymous) @ platform-browser.js:1215
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:421
onInvokeTask @ core.js:4053
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:420
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:188
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
如果我使用这样的东西,它会起作用:
return this.service
.isNicknameNotTaken(control.value)
.pipe(
map(res => {
return res ? null : {nicknameTaken: true};
}),
);
我已经迁移了整个应用程序,没有 rxjs-compat。
有什么建议或提示要寻找什么?
最好的问候, 克斯滕
解决方案
推荐阅读
- css - 导航栏背景仅对正文背景透明
- java - 如何使用 oAuth2 通过 EWS 访问 Exchange Server 中的特定邮箱
- reactjs - 是否可以为 React 更改 IBM Carbon Search 组件上的放大镜图标?
- javascript - React.js - 在 componentDidMount() 中调用函数时状态不会更新
- django - 使用 Pillow 访问数据会在 Django Rest Framework 中响应时损坏数据(您上传的文件不是图像或损坏的图像。)
- c# - EF Core 数据库操作引发错误“自加载实体以来数据可能已被修改或删除”
- python-3.x - 如何使用 Selenium 打开 google-chrome-devtools 并将切换设备工具栏设置为特定设备(例如:iPhone X)?
- protractor - 等待和睡眠在量角器上不起作用
- sql - 为什么在 Postgres 中查询表 pg_enum 时结果的顺序会有所不同?
- node.js - 从 --watch 标志重新启动应用程序后运行“pm2 save”