Angulaire - "n'a aucun membre exporté" Observable ""

Code dactylographié:

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 d'erreur:

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: / angular-tour-of-heroes / node_modules / rxjs / Observable"' n'a pas de membre exporté 'Observable'. src / app / hero.service.ts (15,12): erreur TS2304: Impossible de trouver le nom «de».

package.json fichier avec la version angulaire:

Cela peut être utile dans Angular 6 pour plus d'informations, reportez-vous à ce document

1. rxjs: méthodes de création, types, ordonnanceurs et utilitaires

import {Observable, Subject, asapScheduler, pipe, of, from, interval, merge, fromEvent} from 'rxjs';

2. rxjs / operators : Tous les opérateurs canalisables:

importer {map, filter, scan} depuis 'rxjs / operators';

3. rxjs / webSocket: l' implémentation du sujet du socket Web

import {webSocket} depuis 'rxjs / webSocket';

4. rxjs / ajax : l'implémentation de Rx ajax

import {ajax} de 'rxjs / ajax';

5. rxjs / testing : les utilitaires de test

import {TestScheduler} depuis 'rxjs / testing';

Apparemment (comme vous le pointez 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 --savepour installer. Devrait le réparer.

Mettez simplement:

import { Observable} from 'rxjs';

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

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

Vous utilisez RxJS 6. Remplacez simplement

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

par

import { Observable, of } from 'rxjs';

Essaye ça:

npm install rxjs-compat --save

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 node_modulesdossier

3. npm cache verify
4. npm install

J'ai eu un problème similaire. Le retour en arrière de RXJS de 6.x à la dernière version 5.x l'a corrigé pour Angular 5.2.x.

Ouvrez package.json.

Changer "rxjs": "^6.0.0",pour"rxjs": "^5.5.10",

courir npm update

Retirez simplement /Observablede'rxjs/Observable';

Si vous obtenez ensuite Cannot find module 'rxjs-compat/Observable'juste mis en dessous de la ligne au terminal thr et appuyez sur Entrée.

npm install --save rxjs-compat

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

Ainsi, le code global de hero.service.ts après le changement est:

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);
  }
}

Le angular-splitcomposant n'est pas pris en charge dans Angular 6, donc pour le rendre compatible avec Angular 6, installez en suivant la dépendance dans votre application

Pour que cela fonctionne jusqu'à sa mise à jour, utilisez:

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

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

Le problème a été résolu après l'exécution:

ng update

ng update @angular/cli

Mettez à jour la version angular-in-memory-web-api . La version angular-in-memory-web-api par défaut installée pendant le didacticiel angular-tour-of-heroes était de 0,4. Cela a fonctionné comme un charme dans mon cas. (Utilisation d'Angular 7 avec RxJS 6)

npm i angular-in-memory-web-api@0.8.0

utilisation return Observable.of(HEROES);