2015-12-20 39 views
7

http kodumda bazı reactiveX kullanmaya çalışıyorum. Bunu yapmak için, bir Konu yaratıyorum ve onNext işlevini çağırmaya çalışıyorum, ancak subject.onNext bir işlev olmadığını söyleyen bir hata alıyorum.Subject.onNext bir işlev değil

html:
<input #search (input)="generateSuggestions($event.target.value)">

ts:

import { Jsonp, Response } from 'angular2/http'; 
import { Observable } from 'rxjs/Observable'; 
import { Subject } from 'rxjs/Subject' 
import 'rxjs/add/operator/map'; 
import 'rxjs/add/operator/debounce'; 
import { Injectable } from 'angular2/core'; 

@Injectable() 
export class SearchService { 
    queryStream = new Subject(); 

    generateSuggestions(query: string) { 
     this.queryStream.onNext(query) 
      .debounce(500) 
      .map(
       query => this.jsonp.request(`http://urlendpoint/${query}`) 
         .map((res: Response) => res.json()) 
         .subscribe(results => console.log(results)); 
      ) 
    } 
} 
var queryStream = new Subject(); 

ORİJİNAL İSTİSNA: TypeError: this.queryStream.onNext bu benim düz http fonksiyonları işin tamamı bir işlev

(tutulamaz. jsonp.request (url/query) .map(). subscribe()) ancak onNext operatörü çalışmıyor. Ayrıca, aynı "rxjs/add/operator/..." klasöründe yer almayan ve harita ve geri çekilme gibi görünen flatMap'i içe aktarma konusunda da sorun yaşıyorum.

+5

Bunun nedeni, onNext() 'in eski RxJS'nin (RxJS 4) bir parçası olması, yeni RxJS'de (RxJS 5) ise yöntemin" next() " –

+0

" NEDEN BREAKING CHANGE? !! ÇİFT TARAFINIZI ÇEKMEKTEDİR ... – koo9

cevap

10

ile

import { Observable } from 'rxjs/Observable'; 
import { Subject } from 'rxjs/Subject' 
import 'rxjs/add/operator/map'; 
import 'rxjs/add/operator/debounce'; 

değiştirin:

import * as Rx from "rxjs/Rx"; 

ve

next

değiştirin Rx.Subject

ile onNextSubject değiştirin

+0

Teşekkürler, bu gerçekten ithalatı temizliyor! İlgilenenler için, burada RxJS 4'ten 5'e kadar olan tüm göçmen dokümanı: https://github.com/ReactiveX/RxJS/blob/master/MIGRATION.md – Daynil

+6

Bu biraz ağır değil (büyüklükte) Muhtemelen her şeyi gereksiz yere Rx'den yüklüyor muyuz? https://angular.io/docs/ts/latest/guide/server-communication.html adresindeki önerilere göre, yalnızca ihtiyaç duyduğumuz Rx bileşenlerini/operatörlerini yüklemeliyiz. –