Angular 2 :2.0.0-alpha.31 / Typescript 1.5
目前我将服务管理为一个简单的Class
,然后将此Class
注入其他组件。例如:
export class PlayerService {
http: Http;
players = [];
constructor( @Inject(Http) http) {
this.http = http;
}
getAll(callback) {
this.http.get('/data/players.json')
.toRx()
.map((res) => res.json())
.subscribe((data) => {
this.players= data;
callback(data);
});
}
add(player) {
//call webservice to save user
this.players.push(player); //only if save has work
}
delete(player) {
//Not implemented yet
}
get(id) {
//Not implemented yet
}
}
我想,我这样做的方式不对......
http.get().toRx().subscribe()
?我以为我看到有些人直接从Observable
toRx()
getAll()
),则会执行两个查询。我是否必须管理旗帜或是否有另一种方式?所以我的问题是:
答案 0 :(得分:4)
首先,服务工作做得很好,就像使用Angular2一样:注入其他组件的Class
。
那就是说,关于你提出的其他问题,我宁愿返回并将结果存储在一个承诺中,而不是使用回调:
getAll() {
return players || players = new Promise(
(resolve) => this.http.get('people.json').observer({next: resolve})
);
}
注意:您应该可以使用Observable.toPromise()但由于某种原因,它在Angular2中不起作用
这样进一步调用getAll()不会触发更多响应。
对于同步问题,你不应该这样做。现在你已经在承诺中了,只需调用getAll()并在请求玩家时返回一个承诺。
get(id) {
return getAll().then((result) => {return Promise.resolve(result[id])});
}
关于处理玩家添加和删除的方式,这正是Observables在RxJS中的意图。您需要提供和Observable流,以便在播放器列表更改时通知其观察者。您可以使用EventEmitter:
constructor( @Inject(Http) http) {
this.http = http;
this.myEventEmitter = new EventEmitter();
}
getUpdateStream() {
myEventEmitter.toRx();
}
更改播放器列表时,只需执行myEventEmitter.next(players)