'(src: Observable<any>) => Observable<any>' 类型的参数不可分配给 'OperatorFunction<Object, any>' 类型的参数,这是错误

时间:2021-04-22 04:16:00

标签: angular typescript ionic-framework rxjs observable

在启动应用程序时出现打字稿错误。不知道我在哪里丢失。我认为这是一个 rxjs 版本问题,但没有得到正确的解决方案。 我的系统中显示不兼容的类型。 无法获得响应表单 observables

当我运行应用程序时出现错误,在代码中添加任何内容(只需保存 app.component.ts 文件的代码)后,它开始工作。

这是我在 rxjs 模块中遇到的错误enter image description here

app.service file

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
import { retryWithBackoff } from './delay-retry-request';

@Injectable()
export class AppService {
    searchText: string;

    constructor(private http: HttpClient) {}

// This is where I m declaring Observable of type any
//Getting in compatable types

    getLanguages(): Observable<any> {
        return <Observable<any>>this.http.get('langs').pipe(
//Error here
            retryWithBackoff(1000, 3)
        );
    }

    getSystemData(): Observable<any> {
        return <Observable<any>>this.http.get('system').pipe(
// Error here
            retryWithBackoff(1000, 3)


----------
**enter image description here**

        );
    }

    getInitialData(): Observable<any> {
        return <Observable<any>>this.http.get('initialData').pipe(
// Error here
            retryWithBackoff(1000, 3)
        );
    }
}


**package.json File**

{
  "name": "fmcg-digital-distribution",
  "version": "0.0.1",
  "author": "Ionic Framework",
  "homepage": "http://ionicframework.com/",
  "private": true,
  "dependencies": {
    "@angular/animations": "6.1.10",
    "@angular/common": "6.1.10",
    "@angular/compiler": "6.1.10",
    "@angular/compiler-cli": "6.1.10",
    "@angular/core": "6.1.10",
    "@angular/forms": "6.1.10",
    "@angular/http": "6.1.10",
    "@angular/platform-browser": "6.1.10",
    "@angular/platform-browser-dynamic": "6.1.10",
    "@ionic-native/clipboard": "^4.19.0",
    "@ionic-native/core": "~4.15.0",
    "@ionic-native/geolocation": "^4.19.0",
    "@ionic-native/image-picker": "^5.0.0",
    "@ionic-native/splash-screen": "~4.15.0",
    "@ionic-native/status-bar": "~4.15.0",
    "@ionic/storage": "2.2.0",
    "@ngrx/effects": "^5.2.0",
    "@ngrx/store": "^5.2.0",
    "@ngrx/store-devtools": "^5.2.0",
    "@ngx-translate/core": "^9.1.1",
    "@ngx-translate/http-loader": "^2.0.1",
    "ajv": "^5.5.2",
    "codelyzer": "^4.5.0",
    "ionic": "^4.10.2",
    "ionic-angular": "3.9.2",
    "ionic-selectable": "^3.2.0",
    "ionicons": "3.0.0",
    "rxjs": "^6.5.4",
    "rxjs-compat": "^6.5.4",
    "sw-toolbox": "3.6.0",
    "zone.js": "0.8.26"
  },
  "devDependencies": {
    "@ionic/app-scripts": "^3.2.4",
    "typescript": "^3.4.2"
  },
  "description": "An Ionic project",
  "config": {
    "ionic_webpack": "./config/webpack.config.js"
  }
}

retryWithbackoff

import { of } from 'rxjs/observable/of';
import { delay, mergeMap, retryWhen } from 'rxjs/operators';

// const getErrorMessage = (maxRetry: number) => {
//     return `Tried for max ${maxRetry} times without success. Giving up.`;
// };

const DEFAULT_MAX_RETRIES = 5;
const DEFAULT_BACKOFF = 1000;

export function retryWithBackoff(delayMs: number, maxRetry = DEFAULT_MAX_RETRIES, backoffMs = DEFAULT_BACKOFF) {
    let retries = maxRetry;

    return (src: Observable<any>) =>
        src.pipe(
            retryWhen((errors: Observable<any>) => errors.pipe(
                mergeMap(error => {
                    if (retries-- > 0) {
                        const backoffTime = delayMs + (maxRetry - retries) * backoffMs;
                        return of (error).pipe(delay(backoffTime));
                    }
                    // return throwError(getErrorMessage(maxRetry));
                })
            ))
        );
}

1 个答案:

答案 0 :(得分:0)

我不确定这是否会解决您的问题,但我相信不要像这样返回 observable:

return <Observable<any>>this.http.get('langs').pipe(
      //Error here
        retryWithBackoff(1000, 3)
    );

您可以按如下方式进行,因为 http.get() 本身返回提及类型的 observable :

getLanguages(): Observable<any> {
   return this.http.get<any>('langs').pipe(
      retryWithBackoff(1000, 3)
   );
}

更多详情请查看 Returning Typed Angular HttpClient Results