Angular httpClient返回属性在对象上不存在

Question

  constructor(private http: HttpClient) {
  }
  ngOnInit() {
   this.http.get('url').subscribe(data => {
     console.log(data);
     console.log(data.login);
   });
  }
}

在这里，我可以在控制台中看到带有登录名的数据，但是却收到一条错误消息，指出数据中不存在属性登录名。有没有使用界面的解决方法吗？因为我想要获取的数据非常庞大，并且将来可能会被修改，所以还有更好的方法吗？

Answer 1

文档指出使用时HttpClient...

 this.http.get('/api/items').subscribe(data => {
   // Read the result field from the JSON response.
   this.results = data['results'];
 });

在上面的示例中，data['results']字段访问很突出，因为您使用括号表示法来访问结果字段。如果您尝试编写data.results，TypeScript 会正确地抱怨从 HTTP 返回的对象没有属性results。这是因为在HttpClient将 JSON 响应解析为对象时，它不知道该对象是什么形状。

因此，您的选择是要么键入您的响应（文档和我都建议这样做），要么使用括号符号。

输入响应将创建一个接口/类，您可以告诉它这是您对请求的期望：

export interface MyResponse {
  results: // your type here
}

this.http.get<MyResponse>('/api/items').subscribe(data => {
   this.results = data.results;
 });