如何管理服务在Angular2 [英] How to manage Services in Angular2

问题描述

2角：2.0.0-alpha.31 /打字稿1.5

Angular 2 : 2.0.0-alpha.31 / Typescript 1.5

目前管理我的服务作为一个简单的类，然后我注入这个类到其他组件。例如：

Currently I manage my service as a simple Class, then I inject this Class into an other component. Example:

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   
  }
}

我想，我做了错误的方式。

I think, I'm doing it the wrong way..

• 我用 http.get（）。梅花头（）。认购（）？我以为我看见一些人返回观测直接从梅花头（）


• 如果两个组件为玩家问（ GETALL（）），在同一时间，两个查询将被执行。我必须管理标志或有另一种方式？


• 我正与一个回调在这里工作。我有什么做的，如果我想要的数据立即（无异步）


• 威尔组件自动告知玩家添加/删除？我一定要使用某种类型的事件来处理这个（例如任何？）？

• I'm using http.get().toRx().subscribe() ? I thought I saw that some people return the Observable directly from toRx()
• If two components ask for players (getAll()) at the same time, two queries will be executed. Do I have to manage flag or is there another way ?
• I'm working here with a callback. What do I have to do if I want the data "immediately" (no async)
• Will components be automatically informed about players add/remove ? Do I have to use some kind of event to handle this (any example?) ?

所以我的问题是：

• 有没有管理服务的一种常见方式的 Angular2 ？

• Is there a common way to manage Services in Angular2 ?

推荐答案

首先服务的是做得很好，你做了，这是一起去Angular2方式：A 类注入到其他组件。

First of all the service is well done as you did it, and it's the way to go with Angular2: A Class injected into the other components.

这是说，你提高等问题，我宁愿回来，结果存储在一个承诺，而不是使用回调的：

That said, about the other issues you raise, I'd rather return and store the result in a promise instead of using a callback:

getAll() {
    return players || players = new Promise(
        (resolve) => this.http.get('people.json').observer({next: resolve})
    );
}

注意：你应该能够使用Observable.toPromise（），但由于某种原因，它不是在Angular2为我工作

Note: You should be able to use Observable.toPromise() but for some reason it's not working for me in Angular2

此方式还呼吁GETALL（）不会引发更多的反应。

This way further calls to getAll() will not trigger more responses.

要同步的问题，你不应该这样做。现在，你拥有了它的承诺里，只需调用GETALL（）和当过要求玩家回归的承诺。

To the synchronous questions, you should not do that. Now that you have it inside a promise, just call getAll() and return a promise when ever a player is requested.

get(id) {
    return getAll().then((result) => {return Promise.resolve(result[id])});  
}

关于处理玩家添加和移除的方式，这正是观测量是为了在RxJS。您需要提供并通知它的观察者，当球员名单变化观测流。您可以使用 EventEmitter 为：

constructor( @Inject(Http) http) {
    this.http = http;
    this.myEventEmitter = new EventEmitter();
}

getUpdateStream() {
    myEventEmitter.toRx();
}

当你改变了球员名单只是做 myEventEmitter.next（玩家）

When you change the Players list just do myEventEmitter.next(players)

这篇关于如何管理服务在Angular2的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！