Angular不显示从http响应收到的数据答案

【问题标题】：Angular not displaying data received from http responseAngular不显示从http响应收到的数据
【发布时间】：2021-07-08 23:30:50
【问题描述】：

我有一个服务类型脚本类如下：

export class HomeApiService{

apiURL = 'http://localhost:8080/api';

constructor(private http: HttpClient) {}

getProfileData():Observable<HomeModelInterface[]>{
        return this.http.get<HomeModelInterface[]>(this.apiURL+'/home');}
}

我的组件类如下：

export class HomeComponent implements OnInit {

public profileData: HomeModelInterface[] | undefined ;

constructor(private homeApiService:HomeApiService) { }

ngOnInit() {
 this.homeApiService.getProfileData().subscribe(data=> {
   this.profileData = data;
   console.log(this.profileData);
});
}

我的html文件如下：

<div *ngFor="let profile of profileData">
 <h1>{{profile.data}}</h1>
</div>

这里是后端spring boot应用控制器：

@RequestMapping(value = "/api/home" , method = RequestMethod.GET, produces = 
  "application/json")
 public Object getHome() {
    ResponseHome response = new ResponseHome();
    response.setData(new String[]{"Greetings from Spring Boot API home!", 
  HttpStatus.ACCEPTED.toString()});
    return response;
   }

这是我的 ResponseHome java 类：

public class ResponseHome {

private String data[];
private String errors[];

public String[] getData() {
    return data;
}

public void setData(String[] data) {
    this.data = data;
}

public String[] getErrors() {
    return errors;
}

public void setErrors(String[] errors) {
    this.errors = errors;
}
}

这是我的前端模型打字稿类，用于将该 json 解析为模型类：

export interface HomeModelInterface{
data: string[];
errors: string[];
}

当我运行 chrome 时，我看到以下错误：找不到“对象”类型的不同支持对象“[对象对象]”

你能帮忙吗？

【问题讨论】：

响应是一个单一的实体，一个单一的对象，你正试图在它上面运行一个 for 循环。需要直接使用{{profileData.data}}
如果您查看服务类，我将返回 HomeModelInterface getProfileData():Observable{ return this.http.get(this.apiURL+'/家');}
您的响应返回一个带有数组data[] 的HomeModelInterface 实例，因此不要使用HomeModelInterface[]，而是使用HomeModelInterface 并循环遍历model.data[]。

标签： java html angular typescript spring-boot

【解决方案1】：

您的数据是对象而不是数组。为了迭代，您应该获得其中的列表。在 *ngFor 中尝试 profileData.data 之类的东西。

【讨论】：

正如目前所写，您的答案尚不清楚。请edit 添加其他详细信息，以帮助其他人了解这如何解决所提出的问题。你可以找到更多关于如何写好答案的信息in the help center。