Obserwowalny. Nie jest funkcją

192

Mam problem z Observable.offunkcją importowania w moim projekcie. Mój Intellij widzi wszystko. W moim kodzie mam:

import {Observable} from 'rxjs/Observable';

i w moim kodzie używam go w ten sposób:

return Observable.of(res);

Jakieś pomysły?

uksz
źródło
5
Zapoznaj się z najnowszymi dokumentami, jeśli używasz rxjs6 do poprawnego importu i użytkowania import { of } from 'rxjs'; return of(res); github.com/ReactiveX/rxjs/blob/master/MIGRATION.md#import-paths & github.com/ReactiveX/rxjs/blob/master/…
fidev

Odpowiedzi:

232

Właściwie to pomieszałem import. W najnowszej wersji RxJS możemy go zaimportować w następujący sposób:

import 'rxjs/add/observable/of';
uksz
źródło
21
Po moim 192nd Double-Take, zauważyłem, że w moim kodu byłem imporcie z operator/- rxjs/add/operator/of- zamiast observable/. Nie.
EricRobertBrewer
Odkryłem, że nie muszę używać tego oświadczenia w jednym z kątowych projektów. Ale w drugim muszę go zaimportować. Nie rozumiem różnic. Znasz powody?
niaomingjian
1
Może wersja kątowa ?! Nie musiałem tego robić w wersji 4.3.2, ale zrobiłem to w wersji 5.0.0.
Draghon
@Draghon: Dokładnie tak samo ze mną. Nie musiałem tego robić dla 4.4, teraz dla 5.2. Co dziwniejsze, muszę tylko dołączyć go do jednego pliku, a wszystkie inne pliki .ts po prostu go podnoszą i są gotowe.
JP ten Berge
2
Co się stanie, jeśli otrzymam Nie mogę znaleźć modułu „rxjs / add / observable / of”?
Enrico
169

Jeśli ktoś ma ten problem podczas korzystania z Angular 6 / rxjs 6, zobacz odpowiedzi tutaj: Nie można użyć Observable.of w RxJs 6 i Angular 6

Krótko mówiąc, musisz go zaimportować w następujący sposób:

import { of } from 'rxjs';

A potem zamiast dzwonić

Observable.of(res);

po prostu użyj

of(res);
jgosar
źródło
2
Dziękuję Ci! Zrozumienie importu w Rx jest dla mnie zawsze tak wielkim źródłem frustracji ze względu na zmienność API.
DomenicDatti,
43

Chociaż brzmi to absolutnie dziwnie, dla mnie liczyło się pisanie wielkimi literami „O” na ścieżce importu import {Observable} from 'rxjs/Observable. Komunikat o błędzie z observable_1.Observable.of is not a functionpozostaje obecny, jeśli zaimportuję obiekt Observable rxjs/observable. Dziwne, ale mam nadzieję, że to pomaga innym.

Mark Langer
źródło
42

Jeśli używasz Angular 6/7

import { of } from 'rxjs';

A potem zamiast dzwonić

Observable.of(res);

po prostu użyj

of(res);
Akitha_MJ
źródło
Wynika to ze zmian w wersji RxJS z 5 na 6, które wprowadziły wiele przełomowych zmian. Możesz sprawdzić, jak przeprowadzić migrację projektu Angular tutaj: rxjs.dev/guide/v6/migration
Edric
29

Moim głupim błędem było to, że zapomniałem dodać, /addgdy wymagałem obserwacji.

Był:

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

Który wizualnie wygląda OK, ponieważ rxjs/observable/ofplik faktycznie istnieje.

Powinien być:

import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/of';
Oko
źródło
jak zauważył @Shaun_grady, jakoś to nie działa. Poszedłem z jego propozycją
Sonne,
20

Łatki nie działały dla mnie z jakiegokolwiek powodu, więc musiałem skorzystać z tej metody:

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

// ...

return of(res)
Shaun Grady
źródło
To nie jest obejście, to jest składnia Angular> = 6.0.0. import {of} z 'rxjs' był dla mnie w porządku. Zobacz stackoverflow.com/questions/38067580/…
mark_h
18

Po prostu dodaj

jeśli używasz wielu z nich, możesz zaimportować wszystkie za pomocą

import 'rxjs/Rx'; 

jak wspomniano w @Thierry Templier. Ale myślę, że jeśli używasz ograniczonego operatora, powinieneś zaimportować indywidualnego operatora jak

import 'rxjs/add/operator/filter';
import 'rxjs/add/operator/mergeMap';
import 'rxjs/add/observable/of';

jak wspomniał @uksz.

Ponieważ „rxjs / Rx” zaimportuje wszystkie komponenty Rx, które zdecydowanie kosztują wydajność.

Porównanie

dharmesh kaklotar
źródło
1
Odkryłem, że nie muszę używać tego oświadczenia w jednym z kątowych projektów. Ale w drugim muszę go zaimportować. Nie rozumiem różnic. Znasz powody?
niaomingjian
16

Możesz również zaimportować wszystkich operatorów w ten sposób:

import {Observable} from 'rxjs/Rx';
Thierry Templier
źródło
7
Nie polecam importowania w ten sposób, ponieważ jest to dość duża biblioteka, a „of” to bardzo mała jej część.
Metgaard
2
@methgaard import { Observable } from 'rxjs/Observable' import 'rxjs/add/observable/of';nie działa. import {Observable} from 'rxjs/Rx';Działa tylko . Wersja to 5.4.2
niaomingjian,
@methgaard Przepraszam. Popełniłem błąd. Faktem jest, że mam Observable_1.Observable.of(...).delay(...).timeout is not a function. Nie korzystałemimport 'rxjs/add/operator/timeout'
niaomingjian,
Zwiększa także rozmiar pakietu
Amirhossein Mehrvarzi
5

Używam Angulara 5.2 i RxJS 5.5.6

Ten kod nie działał:

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

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

      }

Poniższy kod działał:

    import { Observable } from 'rxjs/Observable';
    import { Subscriber } from 'rxjs/Subscriber';

     getHeroes(): Observable<Hero[]> 
     {
          return Observable.create((observer: Subscriber<any>) => {
              observer.next(HEROES);
              observer.complete();
          });

      }

Metoda wywołania:

this.heroService.getHeroes()
      .subscribe(heroes => this.heroes = heroes);

Myślę, że mogą przenieść / zmienić funkcjonalność () w RxJS 5.5.2

karunakar bhogyari
źródło
4

To powinno działać poprawnie, po prostu spróbuj.

import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/of';
Alok Singh
źródło
4
// "rxjs": "^5.5.10"
import { of } from 'rxjs/observable/of';

.... 
return of(res)
letanthang
źródło
To jest odpowiedź tylko na kod. Czy mógłbyś wyjaśnić, co próbujesz zasugerować?
Peter Wippermann
1
Cześć, powinniśmy importować tylko operatora, którego potrzebujemy, a nie cały „Obserwowalny” z powodu problemów z wydajnością. W nowej wersji (^ 5.5.10) właściwym sposobem importowania operatora „of” jest: import {of} z 'rxjs / observable / of' ... To działa w moim przypadku. Zmienię swoją rozdzielczość. Dzięki Peter.
letanthang
4

Uaktualniono z Angular 5 / Rxjs 5 do Angular 6 / Rxjs 6?

Musisz zmienić import i instancję. Sprawdź post na blogu Damiena

Tl; dr:

import { Observable, fromEvent, of } from 'rxjs';

const yourResult = Observable
    .create(of(yourObservable))
    .startWith(null)
    .map(x => x.someStringProperty.toLowerCase());

//subscribe to keyup event on input element
Observable
    .create(fromEvent(yourInputElement, 'keyup'))
    .debounceTime(5000)
    .distinctUntilChanged()
    .subscribe((event) => {
        yourEventHandler(event);
    });
KVarmark
źródło
1
Przy użyciu wersji 6.0 próba subskrypcji Observable.create (of (val)) zaowocowała „this._subscribe nie jest funkcją”. Zamiast tego udało mi się stworzyć obserwowalne, po prostu nazywając „of (val)”.
Jim Norman
3

RxJS 6

Przy aktualizacji do wersji 6 RxJSbiblioteki i nie korzystaniu z rxjs-compatpakietu następujący kod

import 'rxjs/add/observable/of';   
  // ...
  return Observable.of(res);

należy zmienić na

import { of } from 'rxjs';
  // ...
  return of(res);
zgue
źródło
3

Dla mnie (Angular 5 i RxJS 5) import autouzupełniania sugerował:

import { Observable } from '../../../../../node_modules/rxjs/Observable';

natomiast do powinny być (ze wszystkimi operatorami statycznych from, of, ect grzywny pracy:

import { Observable } from 'rxjs/Observable';
Tomas
źródło
2

Miałem dzisiaj ten problem. Używam systemjs do ładowania zależności.

Ładowałem Rxj w ten sposób:

...
    paths: {
        "rxjs/*": "node_modules/rxjs/bundles/Rx.umd.min.js"
    },
...

Zamiast używać ścieżek użyj tego:

var map = {
...
'rxjs':                       'node_modules/rxjs',
...
}

var packages = {
...
'rxjs': { main: 'bundles/Rx.umd.min.js', defaultExtension: 'js' }
...
}

Ta niewielka zmiana w sposobie ładowania biblioteki systemjs naprawiła mój problem.

Eli
źródło
Pytanie dotyczy Angulara 2. Nie działa dobrze z modułem RxJS UMD .
Estus Flask,
2

Dla Angular 5+:

import { Observable } from 'rxjs/Observable';powinno działać. Pakiet obserwatora powinien również pasować do importu, import { Observer } from 'rxjs/Observer';jeśli używasz tego obserwatora

import {<something>} from 'rxjs'; robi ogromny import, więc lepiej tego uniknąć.

SS-
źródło
1
import 'rxjs/add/observable/of';

pokazuje wymaganie rxjs-kompatybil

require("rxjs-compat/add/observable/of");

Nie zainstalowałem tego. Zainstalowany przez

npm install rxjs-compat --save-dev

a ponowne uruchomienie rozwiązało mój problem.

Esaith
źródło
1

W rxjsV6, ofoperator powinien być importowane jakoimport { of } from 'rxjs';

Lasantha Basnayake
źródło
0

Jakoś nawet Webstorm tak to zrobił import {of} from 'rxjs/observable/of'; i wszystko zaczęło działać

Jewhenij Potupa
źródło