属性'timeout'在类型 'Observable<Object>' 上不存在

Question

我正在尝试从 6 升级到 Angular 5 并收到此错误：

src/app/services/http.service.ts(17,14( 中的错误：错误 TS2339： 属性"超时"在类型"可观察"上不存在。

我在 http.service.ts 中的代码：

import { throwError as observableThrowError,  Observable } from 'rxjs';
import { Injectable } from '@angular/core';
import { environment } from "environments/environment";
import { AppService } from 'app/app.service';
import { HttpClient } from '@angular/common/http';
@Injectable()
export class HttpService {
private baseUrl = environment.apiUrl;
constructor(private http: HttpClient, private appService: AppService) { }
public get(endpoint: string): Observable<any>{
return this.http.get(this.baseUrl + endpoint)
.timeout(this.appService.timeoutInterval)
.retryWhen(error => error.delay(this.appService.waitInterval)
.take(this.appService.numberOfRetries)
.concat(observableThrowError(new Error())))
.share();
}
}

我在这里错过了什么？

Answer 1

您必须添加一个.pipe，然后自 Rxjs 6 以来使用其中的任何运算符。

像这样更改您的实现：

import { throwError ,  Observable, timer } from 'rxjs';
import { Injectable } from '@angular/core';
import { environment } from "environments/environment";
import { AppService } from 'app/app.service';
import { HttpClient } from '@angular/common/http';
import { 
timeout,
retryWhen,
take,
concat,
share,
delayWhen
} from 'rxjs/operators';
@Injectable()
export class HttpService {
private baseUrl = environment.apiUrl;
constructor(
private http: HttpClient, 
private appService: AppService
) {}
public get(endpoint: string): Observable < any > {
return this.http.get(this.baseUrl + endpoint)
.pipe(
timeout(2500),
retryWhen(errors =>
errors.pipe(
delayWhen(val => timer(val * 1000))
)
),
take(2),
concat(throwError('This is an error!')),
share()
);
}
}

PS：我冒昧地用我自己的实现更改了您的AppService.引用，因为您没有共享您的AppService代码。

Answer 2

您应该使用 ng update 进行更新 - 请参阅 https://blog.angular.io/version-6-of-angular-now-available-cc56b0efa7a4(向下滚动一点(

根据此链接，这将自动安装rxjs-compat这将启用对 RxJs v5 和 v6 的支持

但是，如果需要，您可以手动安装rxjs-compat。

这将简化 ng5 到 ng6 的过渡，然后(可选(稍后在更专注于 RxJs 的任务中将其拉出。

Answer 3

现在，您应该使用debounceTime而不是timeout。 例如，来自官方文档：

this.heroes$ = this.searchTerms.pipe(
// wait 300ms after each keystroke before considering the term
debounceTime(300),
// ignore new term if same as previous term
distinctUntilChanged(),
// switch to new search observable each time the term changes
switchMap((term: string) => this.heroService.searchHeroes(term)),
);

Answer 4

您必须执行命令

npm install rxjs-compat