Angular 表中未加载来自可观察角度6的数据

我通过从服务获取数据来加载表。我正在订阅数据，但无法将其加载到表中。我的代码片段如下：

TS:

HTML:

列名
{{data.columnName}

服务台

  uploadCSV(a,b): Observable<any> { 
    return this.httpClient.post(URL, {"a":a,"b":b});
  }

uploadCSV（a，b）：可观察{
返回这个.httpClient.post（URL，{“a”：a，“b”：b}）；
}

控制台中是否有错误？问题可能是您试图使用未定义值的

*ngFor

针对您的问题有两种不同的解决方案：

直接使用可观测数据

// In TS
csvColumns$: Observable<any>;

ngOnInit() {
  this.csvColumns$ = this.demoService.uploadCSV(a,b).pipe(map(d => d.response.fields);
}

// in HTML
<ng-container *ngFor="let data of csvColumns$ | async;">
  <tr>
    <td>{{data.columnName}}</td>
  </tr>
</ng-container>

试试这个：

this.demoService.uploadCSV(a,b).subscribe(Response => {
  if(Response) {
    console.log("Response is ", Response);
    this.csvColumns = Response.response.fields
  }
}

---

demoServiceIf

Response

未定义上传CSV（a、b）函数的post代码。我猜这是您获取数据的后端出现错误。您能否验证后端是否产生了正确的响应（例如使用Postman）？我可以在dev的网络选项卡中看到响应tools@user9040429，在您的实际应用程序中，

b

之后是否有逗号，或者您在此处错误地使用了逗号<代码>上传CSV（a，b，）。如果是，请将其移除。。

// In TS
csvColumns$: Observable<any>;

ngOnInit() {
  this.csvColumns$ = this.demoService.uploadCSV(a,b).pipe(map(d => d.response.fields);
}

// in HTML
<ng-container *ngFor="let data of csvColumns$ | async;">
  <tr>
    <td>{{data.columnName}}</td>
  </tr>
</ng-container>

// In TS
csvColumns: any[] = [];

ngOnInit() {
  this.demoService.uploadCSV(a,b).subscribe(response => {
    if(response)
      this.csvColumns = response.response.fields;
  };
}

this.demoService.uploadCSV(a,b).subscribe(Response => {
  if(Response) {
    console.log("Response is ", Response);
    this.csvColumns = Response.response.fields
  }
}