web-dev-qa-db-fra.com

Angular - "n'a pas de membre exporté 'Observable'"

code

error info

Code TypeScript:

_import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';
import { Hero } from './hero';
import { HEROES } from './mock-heroes';

@Injectable({
  providedIn: 'root'
})
export class HeroService {

  constructor() { }

  getHeroes(): Observable<Hero[]> {
    return of(HEROES);
  }

}
_

info info:

erreur TS2307: Impossible de trouver le module 'rxjs-compat/Observable'. node_modules/rxjs/observable/of.d.ts (1,15): erreur TS2307: Impossible de trouver le module 'rxjs-compat/observable/of'. src/app/hero.service.ts (2,10): erreur TS2305: le module '"F:/tour angulaire des héros/node_modules/rxjs/Observable"' n'a aucun membre exporté "Observable". src/app/hero.service.ts (15,12): erreur TS2304: Impossible de trouver le nom 'of'.

_package.json_ fichier avec Angular version:

version

132
Thomas Lee

J'ai remplacé le code d'origine par import { Observable, of } from 'rxjs' et le problème est résolu.

enter image description here

enter image description here

49
Thomas Lee

Cela pourrait être utile dans Angular 6 pour plus d’informations, reportez-vous à cette Document

  1. rxjs: Méthodes de création, types, ordonnanceurs et utilitaires
import {observable, sujet, asapScheduler, pipe, de, à partir de, intervalle, fusion, deEvent} à partir de 'rxjs';
  1. rxjs/opérateurs : Tous les opérateurs pouvant être raccordés:
importer {map, filter, scan} de 'rxjs/operators';
  1. rxjs/webSocket: L'implémentation du sujet du socket Web
importer {webSocket} de 'rxjs/webSocket';
  1. rxjs/ajax : l'implémentation de Rx ajax
importer {ajax} de 'rxjs/ajax';
  1. rxjs/testing : les utilitaires de test
importer {TestScheduler} de 'rxjs/testing';
172
Sanjeet kumar

Apparemment (comme vous l'indiquez dans le journal des erreurs), après la mise à jour vers Angular 6.0.0, rxjs-compat est manquant.

Exécutez npm install rxjs-compat --save pour l'installer. Devrait le réparer.

94
pau

Il suffit de mettre:

import { Observable} from 'rxjs';

Juste comme ça. Rien de plus ou de moins.

71
Marius Mielcarek

Vous utilisez RxJS 6. Il suffit de remplacer

import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';

par

import { Observable, of } from 'rxjs';
26
veben

Essaye ça:

npm install rxjs-compat --save
7
Yogesh Patil

Ce qui m'a aidé, c'est:

  1. Débarrassez-vous de tous les anciens chemins d'importation et remplacez-les par de nouveaux, comme ceci:

    import { Observable , BehaviorSubject } from 'rxjs';)

  2. Supprimer le dossier node_modules

  3. npm cache verify
  4. npm install
7
Jackie

J'ai eu un problème similaire. La révision de RXJS de la version 6.x à la dernière version 5.x a corrigé le problème pour Angular 5.2.x.

Ouvrez package.json.

Remplacez "rxjs": "^6.0.0", par "rxjs": "^5.5.10",

lancer npm update

5
Matthew Smith

Le composant angular-split n'est pas pris en charge dans Angular 6, donc pour le rendre compatible avec Angular 6, procédez comme suit après votre dépendance dans votre application.

Pour que cela fonctionne jusqu'à ce qu'il soit mis à jour, utilisez:

"dependencies": {
"angular-split": "1.0.0-rc.3",
"rxjs": "^6.2.2",
    "rxjs-compat": "^6.2.2",
}
2
Manoj Gupta

Ma résolution ajoutait l'importation suivante: import { of } from 'rxjs/observable/of';

Ainsi, le code général de hero.service.ts après le changement est le suivant:

import { Injectable } from '@angular/core';
import { Hero } from './hero';
import { HEROES } from './mock-heroes';
import { of } from 'rxjs/observable/of';
import {Observable} from 'rxjs/Observable';

@Injectable()
export class HeroService {

  constructor() { }

  getHeroes(): Observable<Hero[]> {
    return of(HEROES);
  }
}
2
Mark Mishaev

Il suffit de retirer /Observable de 'rxjs/Observable';

Si vous obtenez alors Cannot find module 'rxjs-compat/Observable', mettez juste en dessous de la ligne jusqu'au terminal et appuyez sur entrée.

npm install --save rxjs-compat
2
Blasanka

Dans mon cas, cette erreur se produisait car j'avais une ancienne version de ng cli sur mon ordinateur.

Le problème a été résolu après avoir exécuté:

ng update

ng update @angular/cli

0
sebbab

Mise à jour angular-in-memory-web-api version. La version par défaut de version angulaire-en-mémoire-web-api installée pendant le didacticiel version angulaire-tour-des-héros était de 0,4. Cela a fonctionné comme un charme dans mon cas. (Utilisation de Angular 7 avec RxJS 6)

npm i [email protected]
0
rtrigo