Question

我看到许多类似的帖子，但是没有一种解决方案适合我。因此，请不要发送给我阅读其他帖子来回答，因为在发布之前，我已经这样做了。我正在尝试通过调用服务来初始化组件属性。这是组件代码：

export class MyComponent implements OnInit {
  myData: number[];

  constructor(@Inject(MyService) private myService: MyService) {
}

ngOnInit() {
  this.myService.getMyData().subscribe(data => this.myData = data);
}

服务代码如下：

@Injectable()
export class MyService implements OnInit {
  private numbers: Observable<number[]>;

  constructor(@Inject(HttpClient) private http: HttpClient) {}

  getMyData(): Observable<number[]> {
    return this.numbers;
  }

ngOnInit() {
 this.http.post<MyDataResponse> (this.url, new MyDataRequest(100))
   .subscribe(resp => this.numbers = 
   observableOf(resp.data));
}

在运行时，出现以下异常：

ERROR TypeError: Cannot read property 'subscribe' of undefined
at .../MyComponent.ngOnInit (...)
at checkAndUpdateDirectiveInline (core.js:18620)
at checkAndUpdateNodeInline (core.js:19884)
at checkAndUpdateNode (core.js:19846)
at debugCheckAndUpdateNode (core.js:20480)
at debugCheckDirectivesFn (core.js:20440)
at Object.eval [as updateDirectives] (...)
at Object.debugUpdateDirectives [as updateDirectives] (core.js:20432)
at checkAndUpdateView (core.js:19828)
at callViewAction (core.js:20069

因此，为了恢复，该组件通过调用rest端点来订阅服务返回的可观察对象。其余端点按预期工作，并调用正确函数并返回正确的响应。异常可能与操作的异步类型有关，但我不知道该如何处理。另外，我不需要该操作是非同步的，但令人惊讶的是，我没有找到任何一种方式来执行angular中的同步rest调用。任何人都可以在这个问题上多说些什么吗？提前谢谢了。尼古拉斯

Answer 1

可能在观察之前，您正在this.numbers中使用变量getMyData()，因此错误为undefined。

您可能想做的事情是这样的：

ngOnInit() {
    this.numbers =  this.http.post<MyDataResponse> (this.url, new MyDataRequest(100));
}

如何通过HttpClient调用服务来初始化组件数据

1 个答案: