angular - Angular 9:在 GUI 上列出用户详细信息
问题描述
我想列出使用 Angular 在页面上注册的用户。
API 响应:
{
"message": "User list is fetched successfully",
"result": [
{
"firstName": "xcvbn",
"lastName": "fvbnm",
"domain": "hgj"
},
{
"firstName": "wdD",
"lastName": "DWQ",
"domain": "hDWgj"
},
{
"firstName": "GH",
"lastName": "J",
"domain": "RF"
},
{
"firstName": "D",
"lastName": "F",
"domain": "K"
}
],
"status": true,
"responseCode": "200"
}
我能够获得 API 响应,但无法在 UI 上显示列表。这是我为列出用户列表而创建的 component.html 类
**component.html**
<div class="container">
<div class="container">
<div class="container">
<div class="row col-md-6 col-md-offset-2 custyle">
<table class="table table-striped custab">
<thead>
<tr>
<th>Frist Name</th>
<th>Last name</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let user of users">
<td>{{user.firstName}}</td>
<td>{{user.lastName}}</td>
</tr>
</tbody>
</table>
</div>
</div>
解决方案
尝试将您的 html 更改为
<div class="container">
<div class="container">
<div class="container">
<div class="row col-md-6 col-md-offset-2 custyle">
<table class="table table-striped custab">
<thead>
<tr>
<th>Frist Name</th>
<th>Last name</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let user of users.result">
<td>{{user.firstName}}</td>
<td>{{user.lastName}}</td>
</tr>
</tbody>
</table>
</div>
</div>
推荐阅读
- bash - bash:如何获得
在“cat”创建文件命令的内容中 - tensorflow - 在构建 tf_estimator 时面临 tensorflow2.0 中的错误
- ios - 如何在 UITableViewCell 单元格中隐藏具有大小的按钮?
- apache-poi - 找不到使用 Apache POI 添加错误栏的 API
- mysql - 外键约束的格式不正确 laravel 6
- microservices - mulesoft 中的系统 API
- hadoop - 远程 HDFS 文件从安全集群移动到非安全集群不起作用
- vb.net - e.RichTextBox 中的Handled 无效。在 TextBox 上,它可以工作
- javascript - 与“标准”JWT 身份验证相比,passport-jwt 是否引入了任何安全优势?
- flutter - 如何在颤动中更改按钮的大小?