我的代码有一个 Subject
,当添加新值时,它会触发一个返回 Observable
的 HTTP 请求。
我想以两种不同的方式(使用相同的数据)处理这些数据,并使用存储在 group
和 times
中的结果 Observables
作为使用 async
管道放入 ngFor
的值。
虽然这确实有效,但 HTTP 请求会被发送多次 - 我只想为每个订阅发送一次。
下面是一个最小的例子。
import { Component, OnInit } from "@angular/core";
import { Observable } from "rxjs/Observable";
import { Subject } from "rxjs/Subject";
import { ExampleService } from "../example.service";
import "rxjs/add/operator/switchMap";
@Component({
templateUrl: "./example.component.html",
styleUrls: ["./example.component.scss"]
})
export class ExampleComponent implements OnInit {
constructor(
private exampleService: ExampleService
) { }
ngOnInit() {
var selections = new Subject<string>();
var appointments = selections
// exampleService.getData returns an HTTP observable.
.switchMap(date => this.exampleService.getData(date));
var group = appointments
.map(data => this.process(data));
var times = appointments
.map(data => this.calculateTimes(data));
// Calling subscribe each time sends the HTTP request multiple
// times - I only want it to be send once for both of them: they
// can share the data!!
group.subscribe();
times.subscribe();
// selections.next(someData) is called periodically from some
// omitted code.
}
processExample(data: string[]) {
/*
* Some processing code.
*/
return data;
}
calculateTimes(data: string[]) {
/*
* Some processing code.
*/
return data;
}
}
实现此目标的最佳方法是什么?
最佳答案
您可以使用share
运算符来存档您要查找的内容:
import 'rxjs/add/operator/share';
ngOnInit() {
var selections = new Subject<string>();
var appointments = selections
// exampleService.getData returns an HTTP observable.
.switchMap(date => this.exampleService.getData(date))
.share();
var group = appointments
.map(data => this.process(data));
var times = appointments
.map(data => this.calculateTimes(data));
// Calling subscribe each time sends the HTTP request multiple
// times - I only want it to be send once for both of them: they
// can share the data!!
group.subscribe();
times.subscribe();
// selections.next(someData) is called periodically from some
// omitted code.
}
基本上,不同的观察者
共享相同的source
。
有关运营商的更多信息 here .
关于angular - 如何将同一个可观察对象与多个映射一起使用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46964453/