Ngfor遍历map的方法
Ngfor可以遍历list和数组,但如果想遍历map,可以使用下面的方式
在TypeScript文件中:
let list = Object.keys(MyObject);
在html文件中:
*ngFor="let item of list"
例子
ts文件:
attachMap = {}; // 标的图片
attachMapKey = []; // 标的图片key ionViewDidEnter() {
this.getLoanAttachments();
} getLoanAttachments(){
const paramData = {
'loanId': this.loanId
};
this.productsService.getLoanAttachments(paramData).subscribe(data => {
if(data.success && data.code === '0001'){
// 这里赋值attachMap 和attachMapKey
this.attachMap = data.data.attachMap;
this.attachMapKey = Object.keys(data.data.attachMap);
}
})
}
html文件:
<div *ngFor="let attachKey of attachMapKey" >
<h4>{{ attachKey }}</h4>
<h4>{{ attachMap[attachKey] }}</h4>
</div>
先遍历attachMapKey,然后根据key获取值(attachMap[attachKey])。
参考:
https://stackoverflow.com/questions/37046138/how-to-iterate-object-keys-using-ngfor
Ngfor遍历map的方法的更多相关文章
- java 遍历map的方法
package com.jackey.topic; import java.util.ArrayList;import java.util.HashMap;import java.util.Itera ...
- JAVA遍历Map的方法
import java.util.HashMap; import java.util.Iterator; import java.util.Map; public class TestMap { pu ...
- 遍历Map的方法
1.使用 entrySet() entrySet() --> 官方推荐将Map转换成Map.Entry对象的Set集合 Set entrys = map.entrySet(); Iterat ...
- java 遍历map 方法 集合 五种的方法
package com.jackey.topic; import java.util.ArrayList;import java.util.HashMap;import java.util.Itera ...
- Java中遍历Map的几种方法
转自: http://blog.csdn.net/wzb56/article/details/7864911 方法分为两类: 一类是基于map的Entry:map.entrySet(); 一类是基 ...
- java 中遍历Map的几种方法
方法分为两类: 一类是基于map的Entry:map.entrySet(); 一类是基于map的key:map.keySet() 而每一类都有两种遍历方式: a.利用迭代器 iterator: b.利 ...
- 用来遍历map集合的方法
map集合是以键值对进行存储值的,所以遍历map集合无非就是获取键和值,根据实际需求,进行获取键和值. 1.无非就是通过map.keySet()获取到值,然后根据键获取到值. for(String s ...
- 另一种遍历Map的方式: Map.Entry 和 Map.entrySet()
源网址: http://blog.csdn.net/mageshuai/article/details/3523116 今天看Think in java 的GUI这一章的时候,里面的TextArea这 ...
- [转]另一种遍历Map的方式: Map.Entry 和 Map.entrySet()
转自: http://blog.csdn.net/mageshuai/article/details/3523116 今天看Think in java 的GUI这一章的时候,里面的TextArea这个 ...
随机推荐
- MapReduce编程实例4
MapReduce编程实例: MapReduce编程实例(一),详细介绍在集成环境中运行第一个MapReduce程序 WordCount及代码分析 MapReduce编程实例(二),计算学生平均成绩 ...
- android 学习之rxjava
最近在做的一个项目,所用到的技术和rxjava有关,因此还特地的学习了下,在这简单的介绍下rxjava: RxJava是什么 RxJava 在 GitHub 主页上的自我介绍是 "a lib ...
- flask 邮箱配置
http://blog.csdn.net/stan_pcf/article/details/51098126 先进入邮箱设置 POP3/SMTP/IMAP 下面代码来自知乎 https://www.z ...
- jquery datagrid设置pageSize不起作用
http://www.2cto.com/kf/201212/178098.html —————————————————————————————————————————————————————————— ...
- NIPS(Conference and Workshop on Neural Information Processing Systems)
论文提交时间:5月下旬 会议时间:12月上旬 NIPS2017: 网址:https://nips.cc/
- 第一百六十二节,jQuery入门介绍
jQuery入门 学习要点: 1.什么是 jQuery 2.学习 jQuery的条件 3.jQuery的版本 4.jQuery的功能和优势 5.其他 JavaScript库 6.是否兼容低版本 I ...
- 第一百四十节,JavaScript,封装库--浏览器检测
JavaScript,封装库--浏览器检测 在函数库编写一个,浏览器检测对象 /** sys浏览器检测对象,对象下有两个属性,liu_lan_qi属性和xi_tong属性 * liu_lan_qi属性 ...
- (转)git使用教程
git基础使用:http://geek.csdn.net/news/detail/77455 github介绍:http://stormzhang.com/github/2016/05/25/lear ...
- .NET中的枚举用法浅析
本文简单分析了.NET中的枚举用法.分享给大家供大家参考.具体分析如下: 我理解的枚举就是编程中约定的一个“可选值”:例如QQ的在线状态,分别有 在线,Q我吧,隐身,忙碌等等...我觉得这就是一 ...
- Django admin 的 9 个技巧
Tip 1:Django admin 后台不限于用 Django 开发的网站 虽然 Django admin 管理界面可以非常友好的用在 Django 项目的其它部分,它同样可以很容易用于其它像传统的 ...