Question

以下是我的情景：

我想使用服务向我提供api调用的结果，而不必在组件中使用api get方法。这就是我想在服务中调用的内容：

private getData():Observable<Data>{
    const url = 'myUrl';
    return this.http.get<Data>(url).pipe(
  catchError(this.handleError<Data>('getData'))
);

然后：

 constructor(private http: HttpClient) {
 this.getData().subscribe(t => {
  this.Data = t;
  console.log(this.Data);
  });
}

但是，当我这样称呼时：

retrieveData(): Data{
  return this.Data;
}

在组件中，它返回undefined。我知道这是一个时间问题，但我不清楚我应该如何区别对待。呼叫应该在哪里，以便我可以使用它？我在整个应用程序中使用此服务来维护单个对象，以便在更新调用api之前预览更改。

编辑：这是我尝试调用的一个示例，只是为了看看我是否可以先获取数据：

ngOnInit() {    
  console.log(this.service.retrieveData());
}

（在用于更改Data类对象的组件内）

另一个编辑：该服务在app.module.ts

中声明 Aaaand还有一件事让我意识到我没有澄清。上面的构造函数调用是在服务中，而不是组件。组件应该调用的唯一内容是检索方法

Answer 1

最好在请求完成之前检查undefined。

constructor(private http: HttpClient) {
    this.getData().subscribe(t => {
      if (JSON.stringify(t) != {}) {
        this.Data = t;
        console.log(this.Data);
      }
    });
  }

Angular 4：从组件中使用的服务内部提供数据

1 个答案: