如何解决 rxjs Typescript 错误（Ionic 3，angularfire2）

Posted 2023-03-13

【中文标题】如何解决 rxjs Typescript 错误（Ionic 3，angularfire2）

【英文标题】：How to solve rxjs Typescript error (Ionic 3, angularfire2)

【发布时间】：2019-07-16 13:02:18

【问题描述】：

当我尝试使用 angularfire2 为我的 ionic 3 应用程序提供服务时，我再次出现错误。

这些是错误：

打字稿错误';'预期的。 C:/Users/Admin/Verein/node_modules/rxjs/internal/types.d.ts

export 声明类型 ObservedValueOf = O 扩展 可观察输入？ T：从不；

需要打字稿错误表达式。 C:/Users/Admin/Verein/node_modules/rxjs/internal/types.d.ts

export 声明类型 ObservedValueOf = O 扩展 可观察输入？ T：从不；

Typescript 错误“ObservableInput”仅指一种类型，但正在 在这里用作值。 C:/Users/Admin/Verein/node_modules/rxjs/internal/types.d.ts

Typescript 错误找不到名称“推断”。 C:/Users/Admin/Verein/node_modules/rxjs/internal/types.d.ts

还有更多与 rxjs 相关的内容。例如，我正在使用它：

import  Note  from '../../model/note/note.model';
import  AngularFireDatabase  from 'angularfire2/database';
import  map  from 'rxjs/operators';
import  Observable  from 'rxjs';

@Component(
  selector: 'page-aufgaben',
  templateUrl: 'aufgaben.html'
)
export class AufgabenPage 


  aufgaben: Observable<Note[]>;

  constructor(public navCtrl: NavController, private modal: ModalController, public events: Events, private db: AngularFireDatabase) 

      this.aufgaben = this.db.list('/aufgabenverzeichnis/').snapshotChanges().pipe(
     map(changes =>
       changes.map(c => ( key: c.payload.key, ...c.payload.val() ))
     )
   );
  

这是我的 package.json：

  "name": "Verein",
  "version": "0.0.1",
  "author": "Ionic Framework",
  "homepage": "http://ionicframework.com/",
  "private": true,
  "scripts": 
    "start": "ionic-app-scripts serve",
    "clean": "ionic-app-scripts clean",
    "build": "ionic-app-scripts build",
    "lint": "ionic-app-scripts lint"
  ,
  "dependencies": 
    "@angular/animations": "5.2.11",
    "@angular/common": "5.2.11",
    "@angular/compiler": "5.2.11",
    "@angular/compiler-cli": "5.2.11",
    "@angular/core": "5.2.11",
    "@angular/forms": "5.2.11",
    "@angular/http": "5.2.11",
    "@angular/platform-browser": "5.2.11",
    "@angular/platform-browser-dynamic": "5.2.11",
    "@ionic-native/core": "~4.18.0",
    "@ionic-native/splash-screen": "~4.18.0",
    "@ionic-native/status-bar": "~4.18.0",
    "@ionic/storage": "2.2.0",
    "@reactivex/rxjs": "^5.5.3",
    "angularfire2": "^5.1.1",
    "firebase": "^5.8.4",
    "ionic-angular": "3.9.3",
    "ionicons": "3.0.0",
    "promise-polyfill": "^8.1.0",
    "rxjs": "^6.4.0",
    "rxjs-compat": "^6.4.0",
    "sw-toolbox": "3.6.0",
    "zone.js": "0.8.29"
  ,
  "devDependencies": 
    "@ionic/app-scripts": "3.2.1",
    "@ionic/lab": "1.0.20",
    "typescript": "^2.6.2"
  ,
  "description": "An Ionic project"

我知道这与不同的版本有关，但我读到安装 rxjs compat 应该可以解决问题。问题是它从来没有。当我保存我的项目的一部分而不更改我的 IDE 中的任何内容时，它会在实验室页面重新加载后再次工作，这更加奇怪。所以我真的不知道该怎么办了。请帮忙。

编辑：按照下面的建议并升级到 typscript 2.7.2 和 rxjs/rxjs-compat 到 6.3.3 后，上面的错误消失了，但我得到了一堆新的，在随机保存后也消失了在我的 IDE 中进行项目，但如果我重新 ionic serve --lab 再回来。这些是新的错误：

我设法摆脱了其中的一些（它们都与语法相关），但有一种类型我无法摆脱，因为我不知道如何更改语法。剩下的所有错误都是这样的：

打字稿错误 输入 'Observable' 不可分配给类型 Observable。键入'键：字符串； []' 不能分配给类型 'Note[]'。键入'键：字符串； ' 不可分配给类型 'Note'。类型 ' key: string; 中缺少属性 'title' '。

import  Component  from '@angular/core';
import  NavController  from 'ionic-angular';
import  ModalController  from 'ionic-angular';
import  Events  from 'ionic-angular';
import  Note  from '../../model/note/note.model';
import  AngularFireDatabase  from 'angularfire2/database';
import  map  from 'rxjs/operators';
import  Observable  from 'rxjs';

@Component(
  selector: 'page-aufgaben',
  templateUrl: 'aufgaben.html'
)
export class AufgabenPage 

  public color: string = 'primary';
  public color2: string ='primary';
  aufgaben: Observable<Note[]>;

  constructor(public navCtrl: NavController, private modal: ModalController, public events: Events, private db: AngularFireDatabase) 

/*error points to this.aufgaben*/ this.aufgaben = this.db.list('/aufgabenverzeichnis/').snapshotChanges().pipe(
         map(changes =>
           changes.map(c => ( key: c.payload.key, ...c.payload.val() ))
         )
       );
      

Note.model.ts：

 export interface Note 
  titel: string;
  beschreibung: string;

这个错误在不同的ts文件中多次出现，所以我只列出了一个例子。保存后它们全部消失，并在重新打开应用程序后重新出现，无需我进行任何更改。所以我真的不知道如何解决这个问题。这些语法错误是否与新的打字稿版本有关？

编辑：我能够通过将“aufgaben: Observable<Note[]>”更改为“aufgaben: Observable<any[]>”来解决问题。感谢您的帮助:)。

【参考方案1】：

这些问题与rxjs 和Typescript 有关。对于rxjs 新版本（6.4.0），TypeScript 的最低支持版本为 2.8。但在您的情况下，TypeScript 版本是 2.6.2。这就是这个问题的原因。为了解决这个问题，将TypeScript升级到2.8或将rxjs和rxjs-compat降级到与Typescript 2.6.2兼容的矿工版本。

就我而言，我将 rxjs 和 rxjs-compat 降级为 6.3.3 版本（我的 Typescript 版本是 2.7.2）。

Find more information here

【讨论】：

感谢您的建议。将 rxjs 更改为 6.3.3 并将 typescript 更改为 2.7.2 后，上面的错误消失了，但我收到了一堆与 rxjs 无关的新错误，但与 typescript 和我的代码有关。可能是因为打字稿版本之间的一些合成器发生了变化吗？我对此很陌生，所以我真的不知道该怎么做。再次保存项目后，这些错误再次随机消失，没有任何更改，但当我再次提供项目时再次出现。

编辑：我能够解决您提出建议后出现的错误，因此您的回答肯定解决了我的问题:)。感谢您的建议。