如何将数据从节点 API 打印到角度表。?打印数据时,它显示未定义的元素



我正在尝试打印角度表中的数据,数据来自JSON格式的节点。但是当打印t时,即使在控制台中也显示未定义的数据。我还附上了JSON响应图像。

我正在使用API从MongoDB获取数据并将数据发送到Angular。数据即将到来,但问题是它没有打印在表中。

<table class="table table-bordered table-striped ">
<thead>
<tr>
<th>Username</th>
<th>Date registered</th>
<th>Role</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let x of data ">
<td>{{x.serial}}</td>
<td>2012/01/01</td>
<td>Member</td>
<td>
<span class="badge ba+dge-success">Active</span>
</td>
</tr>

</tbody>
</table>

来自API 的JSON Repsone

{
code: 0,
message: "success",
data: {
labels: [
{
_id: "605b262c36c70c354015a945",
serial: "12345",
sourceApi: "ASDASD",
resultApi: "ASDASD",
labelApi: "ASDASD",
__v: 0
},
{
_id: "605b26bd36c70c354015a946",
serial: "3333",
sourceApi: "sdfdg",
resultApi: "sdsf",
labelApi: "gggg",
__v: 0
},
{
_id: "605b26ea2e5ea63080dd4796",
serial: "3333",
sourceApi: "sdfdg",
resultApi: "sdsf",[enter image description here][1]
labelApi: "gggg",
__v: 0
}
]
}
}

TS文件代码

export class TablesComponent implements OnInit{
public data?:any;
constructor(private api:ApiServiceService) { 
this.api.getDataApi().subscribe(data => {
this.data = data;
})

}

dtOptions: any = {}; 
ngOnInit(){
this.dtOptions = {
"paging"  : true,
"ordering": true,
"info"    : true
};
}

您的JSON由一些其他数据组成,这些数据不需要填充数据。

在您的JSON标签中,它由一个对象数组组成,因此我们必须将其分配给";数据";可变

export class TablesComponent implements OnInit{
public data?:any;
constructor(private api:ApiServiceService) { 
this.api.getDataApi().subscribe(data => {
this.data = data.data.labels;
})

}

最新更新