Angular 6：“typeof Observable”类型上不存在“of”属性答案

【问题标题】：Angular 6: Property 'of' does not exist on type 'typeof Observable'Angular 6：“typeof Observable”类型上不存在“of”属性
【发布时间】：2018-11-25 00:19:21
【问题描述】：

我正在使用 Angular 6 使用 "rxjs": "^6.0.0",

错误：“typeof Observable”类型上不存在属性“of”。

import { Injectable } from '@angular/core';
import { TranslateLoader } from '@ngx-translate/core';
import { Observable, Subject, pipe, of } from 'rxjs';


@Injectable()
export class MiTranslateLoaderService implements TranslateLoader {

  getTranslation(lang: string): Observable<any> {
    return Observable.of({
      lbl_select: 'Select',
    });
  }
}

【问题讨论】：

标签： rxjs angular6 rxjs6

【解决方案1】：

自 RxJS 6 以来，正确且推荐的使用 of() 的方法（Observable.of() 中的 RxJS 5）是这样的：

import { of } from 'rxjs';

我认为这个import { of } from 'rxjs/observable/of'; 仅在您安装了rxjs-compat 软件包时才有效。

【讨论】：

请务必注意，您必须将“return Observable.of”更改为“return of”

【解决方案2】：

这对我有用。

Angular CLI 6.0.8

RxJS 6.2.2

import {of} from 'rxjs/index';


this.dataService.currentData

    .pipe(takeUntil(this.destroy$))
    .pipe(switchMap((myData:MyDataType) =>
      of(this.anotherService.get(myData._id))))
    .pipe(map((response) => {
         if(response instanceof Error) {
            console.log('error:');
            console.dir(response);
         }
         return response;
    }))
    .subscribe((data:any) => {
       doStuff(data);
      },
      response => {
        console.log('response error');
        console.log(response)
      },
      () => {
        console.log('response complete.');


      });

【讨论】：

【解决方案3】：

解决方法是直接返回of(..)：

getTranslation(lang: string): Observable<any> {
    return of({
      lbl_select: 'Select',
    });

【讨论】：

【解决方案4】：

rxjs有一些更新：(Its rxjs6)

import { of } from 'rxjs';

只有在您的应用安装了 rxjs-compat 包时它才会起作用

您可以从rxjs 导入of：

import { Observable,of } from 'rxjs';

然后简单地返回 of()

 return of({
      lbl_select: 'Select',
    });

所以你的代码将是：

import { Injectable } from '@angular/core';
import { TranslateLoader } from '@ngx-translate/core';
import { Observable, of } from 'rxjs';


@Injectable()
export class MiTranslateLoaderService implements TranslateLoader {

  getTranslation(lang: string): Observable<any> {
    return of({
      lbl_select: 'Select',
    });
  }
}

【讨论】：

【解决方案5】：

你需要从rxjs/observable/of导入of

import { of } from "rxjs/observable/of";

用法：

return of({
  lbl_select: 'Select',
});

更新：对于没有 rxjs-compat 的 rxjs 版本 6，您需要从 @martin 提到的 rxjs 本身导入 of。

import { of } from 'rxjs';

Migration guide to rxjs6

【讨论】：

【解决方案6】：

随着版本 6 的发布，RxJS改变了它的内部包结构

https://www.academind.com/learn/javascript/rxjs-6-what-changed/#import-statement-update-path

import 'rxjs/add/observable/of';
// or 
import { of } from 'rxjs/observable/of';

【讨论】：