angular - Angular:使用解析器迭代嵌套对象
问题描述
我的管理模块有这个解析器服务:
constructor(private userservice: UserService) { }
resolve(
route: ActivatedRouteSnapshot,
state: RouterStateSnapshot
): Observable<any> {
return this.userservice.getUserById(route.paramMap.get('id'));
}
}
详细组件中的数据
export class AdminDetailComponent implements OnInit {
user: any;
constructor(private route: ActivatedRoute) {}
ngOnInit() {
this.route.data.subscribe((data:any) => {
this.user=Array.of(data);
console.log(this.user)
});
}
}
管理员路由
const routes: Routes = [
{path:'', component:AdminComponent},
{
path:'user/:id',
component:AdminDetailComponent,
resolve: {
adminUser: UserResolverService
}
}
];
的HTML
<div class="container">
<div class="row">
<div class="col-md-12" *ngFor="let u of user">
{{u.username}}
</div>
</div>
</div>
这是获取数据的结构
[{…}]
0:
adminUser: {username: "spacecadet", password: "12345", id: 2}
__proto__: Object
length: 1
__proto__: Array(0)
我已经尝试了我能记住的所有方法,但我无法获得渲染数据的循环。有人可以帮我解决吗?
解决方案
在你的初始化中,你只需要这个......
this.user = data;
在您的 ngFor 中,您需要正确访问属性....
{{u.adminUser.username}}
推荐阅读
- angular - 如何格式化和显示从 AngularFire 返回的 Firestore 数据?
- mysql - 尝试在 MySQL 上执行更新命令以插入一列数据需要 5 分钟以上。我能做些什么来调试这个?
- python - 在k-means聚类向量量化过程中不了解这些RuntimeWarnings
- android - CheckBoxPreference 一直在检查自己,为什么?
- android - Android - 文本到语音确定进程的结束
- angular - 我已经以角度实现了chartJs
- linux - 无法在 shell 脚本中运行 ansible 命令
- php - 当输出与 excel 函数的输出进行比较时,FV PHP 函数在某些测试中返回错误的输出
- r - 如何使用 R 从 UniProt 下载多个加入?
- tensorflow - 在 TensorFlow 和 Keras 中运行相同的神经网络时结果不一致