0

我正在尝试调用我的支持，它在我的服务中返回数据就好了，但是当我尝试在不同的模块中使用该服务时，它会记录undefined或Observable. 谁能指出我一个好的方向？我读过关于 observables 的文章，但我不是 100% 确定我得到了它们，或者我现在是否需要一个。在我告诉他们去哪里会引发错误之前，我在页面加载时遇到了问题。

无论如何，这里是对后端的调用，它按预期注销游戏数据。这是在我的服务范围内。

  async getAllGames() {
      this.http.get(this.url).subscribe(gameData => {
        console.log(gameData);
        return gameData;
      });
    }

但是当我从我的另一个模块调用我的服务函数时，它返回未定义。

async getGames() {
    const game = await this.games.getAllGames()
    console.log(game);
    _.each(game, (gameData) => {
      this.gamesArray.push(gameData);
    });

    // this.loadCharts(this.gamesArray);

  }
4

2 回答 2

2

不要使用subscribe内部服务。只需从服务开始，您就可以在您需要的任何组件中使用该return服务。Observablesubscribe

如下更改您的服务代码。

getAllGames(): Observable<any> {
    return this.http.get(this.url);
}

然后，您可以subscribe按Observable如下方式访问您的任何组件。

this.games.getAllGames()
    .subscribe((res: any) => {
    // TODO: do what you need with response data
});

附言

如果您仍然需要subscribe内部服务，您应该return使用Promise.

getAllGames(): Promise<any> {
    return new Promise((resolve, reject) => {
      this.http.get(this.url).subscribe((res: any) => {
        resolve(res);
      }, (err: any) => {
        reject(err);
      })
   });
}

从您的任何组件中调用Promise。

this.games.getAllGames()
    .then(data => {
        console.log(data);
    })
    .catch(err => console.error(err))

StackBlitz

于 2019-12-05T00:52:03.263 回答
1

我建议这样一个解决方案，允许您使用相同的服务获取许多组件中的数据：

服务： 

class APIService { 
    private url: '...'
    public getGames$;

    constructor(private http: HttpClient) {
        this.getGames$ = this.http.get(this.url);
    } 
}

零件： 

private games;

constructor(private api: APIService) {
    this.service.getGames$.subscribe(games => {
       this.games = games;
    });
}
于 2019-12-05T00:38:12.823 回答