如何组合多个Observable并在一个订阅中获得所有结果



我正在对RESTful服务进行多次调用。每个电话都会给我一个结果。例如,它返回类似于以下内容的对象:

{
     results: {
          name: "Joe",
          age: 10,     
     }
}

我用不同的请求参数对服务进行了5次不同的调用,我只想在所有5次调用都完成并返回其对象时将结果返回给我的程序。我想返回到应用程序,返回一个由5个对象组成的数组,如上面的那个。

在Observables的Angular 2中如何做到这一点?

这是我刚才尝试过的,但我不明白为什么它不起作用:

    getImage(imageUrl: string) {
        console.log("Fetching from " + imageUrl);
        return Observable.create((o) => {
            this.httpService.get(imageUrl)
            .map(res => {
                return res.json();
            })
            .map(res => res.photos.photo[0])
            .subscribe((result) => {
                console.log(this.generateImageUrl(result));
                o.next(this.generateImageUrl(result));
            });
        });
    }
    getImages(hashtags:string[]){
        var arrayOfObservables = [];
        for (var hashtag in hashtags){
            var url = this.flickrAPI.fetchImagesByTag + hashtags[hashtag];
            var query = this.getImage(url);
            arrayOfObservables.push(query);
        }
        console.log(arrayOfObservables);
        return Observable.forkJoin(arrayOfObservables, function(){
            console.log("Fork Join Done");
            return "from Fork Join with love";
        });
    }

然后订阅部分发生在这里

onSubmit() {
        // First, clear FeedItems
        this.feedItems = [];
        var tweets$ = this.twitterService.getTweets(this.hashtagInput);
        tweets$.subscribe((tweets) => {
            for (var i in tweets) {
                var hashtags = tweets[i].entities.hashtags;
                var flicks$ = this.flickrService.getImages(hashtags);
                this.subscribeToFlicks(flicks$, tweets[i]);
            }
        });
    }

    subscribeToFlicks(flicks$, tweet) {
        console.log("Here");
        flicks$.subscribe((results) => {
            console.log("Flickr Subscription:");
            console.log(results);
            var twitterItem = new TwitterData(tweet.user, tweet.text);
            var flickrItem = new FlickrData("null", results);
            var feedItem = new FeedItem(twitterItem, flickrItem);
            this.feedItems.push(feedItem);
        });
    }

实际上,您需要删除forkJoin方法的第二个参数:

getImages(hashtags:string[]){
    var arrayOfObservables = [];
    for (var hashtag in hashtags){
        var url = this.flickrAPI.fetchImagesByTag + hashtags[hashtag];
        var query = this.getImage(url);
        arrayOfObservables.push(query);
    }
    console.log(arrayOfObservables);
    return Observable.forkJoin(arrayOfObservables);
}

第二个参数对应于CCD_ 2。它允许您(如果您愿意)在接收到所有事件时创建forkJoin返回的结果。如果未指定,它将以数组的形式返回结果。

并订阅返回的可观察对象:

getImages().subscribe(() => {
  console.log("Fork Join Done");
});

因为可观察对象是惰性的,如果不订阅,则不会执行任何操作。。。

编辑

您可以通过以下方式更新étiAge方法:

    getImage(imageUrl: string) {
        console.log("Fetching from " + imageUrl);
        return this.httpService.get(imageUrl)
            .map(res => {
                return res.json();
            })
            .map(res => res.photos.photo[0])
            .map(res => this.generateImageUrl(res));
    }

最新更新