[英]Angular 4 to 5 Upgrade - Observable.of
I am attempting to update some Angular 4 /rxjs code to use the new version 5 syntax and am running into some trouble. 我试图更新一些Angular 4 / rxjs代码以使用新的版本5语法,但遇到了一些麻烦。
Original Import Statements: 原始进口声明:
import { Injectable } from '@angular/core';
import { Http, Response, Headers, RequestOptions } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import Properties from './properties';
import ErrorHandler from './error-handler';
//From vendor.ts
import 'rxjs/Subject'
import 'rxjs/BehaviorSubject';
import 'rxjs/Observable';
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/filter';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/switchMap';
import 'rxjs/add/operator/mergeMap';
import 'rxjs/add/operator/debounceTime';
import 'rxjs/add/operator/timeoutWith';
import 'rxjs/add/operator/retryWhen';
import 'rxjs/add/operator/delay';
import 'rxjs/add/operator/distinctUntilChanged';
import 'rxjs/add/observable/of';
import 'rxjs/add/operator/publishReplay';
import 'rxjs/Subscription';
Original Code: 原始代码:
downloadStatus(job : DownloadJob) : Observable<DownloadJob> {
let params = {"jobId": job.id};
return this.http.post(Properties.URLS.core.downloadStatus.href, params, this.getOptions())
.retryWhen((errors) => {
return errors.mergeMap((error) => (error.status === 404) ? Observable.of(error) : Observable.throw(error))
.delay(Properties.SETTINGS.download.pollInterval);
})
.timeoutWith(Properties.SETTINGS.download.timeout, Observable.of<DownloadJob>(job))
.map(this.extractData).catch(ErrorHandler.handleError);
}
Updated Import Statements: 更新的导入声明:
import { Injectable } from '@angular/core';
import { Http, Response, Headers, RequestOptions } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import { map, catchError, retryWhen, timeoutWith, flatMap, mergeMap, delay } from 'rxjs/operators';
import { of } from 'rxjs/observable/of';
import Properties from './properties';
import ErrorHandler from './error-handler';
//From vendor.ts
import 'rxjs/Subject'
import 'rxjs/BehaviorSubject';
import 'rxjs/Observable';
import 'rxjs/operators/catchError';
import 'rxjs/operators/filter';
import 'rxjs/operators/map';
import 'rxjs/operators/switchMap';
import 'rxjs/operators/mergeMap';
import 'rxjs/operators/debounceTime';
import 'rxjs/operators/timeoutWith';
import 'rxjs/operators/retryWhen';
import 'rxjs/operators/delay';
import 'rxjs/operators/distinctUntilChanged';
import 'rxjs/operators/publishReplay';
import 'rxjs/observable/of';
import 'rxjs/Subscription';
Updated Code: 更新的代码:
downloadStatus(job : DownloadJob) : Observable<DownloadJob> {
let params = {"jobId": job.id};
return this.http.post(Properties.URLS.core.downloadStatus.href, params, this.getOptions()).pipe(
retryWhen((errors) => {
return errors.pipe(
mergeMap((error) => (error.status === 404) ? of(error) : Observable.throw(error)),
delay(Properties.SETTINGS.download.pollInterval)
);
}),
timeoutWith(Properties.SETTINGS.download.timeout, of(job)),
map(this.extractData),
catchError(ErrorHandler.handleError)
);
}
Error Message: 错误信息:
TS2345: Argument of type 'UnaryFunction<Observable<DownloadJob>, Observable<DownloadJob>>' is not assignable to parameter of type 'UnaryFunction<Observable<Response>, Observable<DownloadJob>>'.
Types of parameters 'source' and 'source' are incompatible.
Type 'Observable<Response>' is not assignable to type 'Observable<DownloadJob>'.
Type 'Response' is not assignable to type 'DownloadJob'.
Property 'id' is missing in type 'Response'.
The problem I am having is with the conversion from Observable.of(job) in the timeoutWith function to of(job). 我遇到的问题是timeoutWith函数中从Observable.of(job)到of(job)的转换。 The TypeScript compiler is now (understandably) complaining about being able to assign the object type. TypeScript编译器现在(可以理解)抱怨能够分配对象类型。
With this new syntax how to I fix that? 使用这种新语法,我该如何解决?
Thanks in advance! 提前致谢!
It looks like you need a map(response => response.json() as DownloadJob)
somewhere (likely before retryWhen()
). 似乎您需要在某处retryWhen()
一个map(response => response.json() as DownloadJob)
(可能在retryWhen()
之前)。
It makes sense that it complains about post()
returning Observable<Response>
, and timeoutWith()
returning DownloadJob
. 抱怨post()
返回Observable<Response>
timeoutWith()
,而timeoutWith()
返回DownloadJob
timeoutWith()
。
You didn't see the problem before because the typing of the old prototype-style timeoutWith
was wrong. 您以前没有看到过这个问题,因为旧的原型样式timeoutWith
是错误的。 It was still showing the return type as Observable<Response>
and ignoring the type of the argument passed to it. 它仍然将返回类型显示为Observable<Response>
并且忽略了传递给它的参数的类型。
I think I found a work around. 我想我找到了解决方法。 I am a little new to the rxjs and Observable, but I think this is equivalent: 我对rxjs和Observable有点陌生,但我认为这是等效的:
downloadStatus(job : DownloadJob) : Observable<DownloadJob> {
let params = {"jobId": job.id};
return this.http.post(Properties.URLS.core.downloadStatus.href, params, this.getOptions()).pipe(
retryWhen((errors) => {
return errors.pipe(
mergeMap((error) => (error.status === 404) ? of(error) : Observable.throw(error)),
delay(Properties.SETTINGS.download.pollInterval)
);
}),
timeoutWith(Properties.SETTINGS.download.timeout,
Observable.create(observer => {
observer.next(job);
observer.complete();
})),
map(this.extractData),
catchError(ErrorHandler.handleError)
);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.