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这个 ...
随机推荐
- CCNA2.0笔记_OSI模型
OSI模型分为七层: –由下到上分别为物理层.数据链路层.网络层.传输层.会话层.表示层.应用层. 特点:1.OSI模型每层都有自己的功能集:2.层与层之间相互独立又相互依靠:3.上层依赖于下层,下层 ...
- typedef可以成为你的朋友
typedef static char int8;这个声明正确吗? A:err 所以上面那个声明是错误的. typedef为一种类型引入新的名字,而不是为变量分配空间,它并没有引入新的类型,而是为现有 ...
- 初探csrf学习笔记
以下是学习了对CSRF的理解,大家切勿作为标准,如有出错请告之! 严禁转载.不想拿自己刚学到的知识去[误人子弟]之所以写出来是让自己巩固和增加理解,他日对此文有不当之处自会修改. [00x1]csrf ...
- U盘工作原理(转)
u盘工作原理 一. U盘基本工作原理 通用串行总线(Universal serial Bus)是一种快速灵活的接口, 当一个USB设备插入主机时,由于USB设备硬件本身的原因,它会使USB总线的数据信 ...
- poj2987 Firing 最大权闭合子图 边权有正有负
/** 题目:poj2987 Firing 最大权闭合子图 边权有正有负 链接:http://poj.org/problem?id=2987 题意:由于金融危机,公司要裁员,如果裁了员工x,那么x的下 ...
- Tutorial : How to Create a Border Glow Effect in JavaFX
http://blog.idrsolutions.com/2014/02/tutorial-create-border-glow-effect-javafx/ ———————————————————— ...
- Linux利器:WinSCP,Putty,pscp和psftp
# Summary PuTTY (Telnet 和 SSH 客户端) PSCP (SCP 客户端, 命令行下通过 SSH 拷贝文件,类似于 Unix/Linux 下的 scp 命令) PSFTP (S ...
- AJAX防止多次请求
ajax诠释 ajax 的全称是Asynchronous JavaScript and XML,其中,Asynchronous 是异步的意思,它有别于传统web开发中采用的同步的方式. ajax所包含 ...
- CSS3自定义滚动条样式 -webkit-scrollbar (一)
Webkit支持拥有overflow属性的区域,列表框,下拉菜单,textarea的滚动条自定义样式.当然,兼容所有浏览器的滚动条样式目前是不存在的. 滚动条的组成: ::-webkit-scroll ...
- Python之Matplotlib库常用函数大全(含注释)
plt.savefig(‘test’, dpi = 600) :将绘制的图画保存成png格式,命名为 test plt.ylabel(‘Grade’) : y轴的名称 plt.axis([-1, 1 ...