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的方法的更多相关文章

  1. java 遍历map的方法

    package com.jackey.topic; import java.util.ArrayList;import java.util.HashMap;import java.util.Itera ...

  2. JAVA遍历Map的方法

    import java.util.HashMap; import java.util.Iterator; import java.util.Map; public class TestMap { pu ...

  3. 遍历Map的方法

    1.使用 entrySet() entrySet()  -->  官方推荐将Map转换成Map.Entry对象的Set集合 Set entrys = map.entrySet(); Iterat ...

  4. java 遍历map 方法 集合 五种的方法

    package com.jackey.topic; import java.util.ArrayList;import java.util.HashMap;import java.util.Itera ...

  5. Java中遍历Map的几种方法

      转自: http://blog.csdn.net/wzb56/article/details/7864911 方法分为两类: 一类是基于map的Entry:map.entrySet(); 一类是基 ...

  6. java 中遍历Map的几种方法

    方法分为两类: 一类是基于map的Entry:map.entrySet(); 一类是基于map的key:map.keySet() 而每一类都有两种遍历方式: a.利用迭代器 iterator: b.利 ...

  7. 用来遍历map集合的方法

    map集合是以键值对进行存储值的,所以遍历map集合无非就是获取键和值,根据实际需求,进行获取键和值. 1.无非就是通过map.keySet()获取到值,然后根据键获取到值. for(String s ...

  8. 另一种遍历Map的方式: Map.Entry 和 Map.entrySet()

    源网址: http://blog.csdn.net/mageshuai/article/details/3523116 今天看Think in java 的GUI这一章的时候,里面的TextArea这 ...

  9. [转]另一种遍历Map的方式: Map.Entry 和 Map.entrySet()

    转自: http://blog.csdn.net/mageshuai/article/details/3523116 今天看Think in java 的GUI这一章的时候,里面的TextArea这个 ...

随机推荐

  1. CCNA2.0笔记_OSI模型

    OSI模型分为七层: –由下到上分别为物理层.数据链路层.网络层.传输层.会话层.表示层.应用层. 特点:1.OSI模型每层都有自己的功能集:2.层与层之间相互独立又相互依靠:3.上层依赖于下层,下层 ...

  2. typedef可以成为你的朋友

    typedef static char int8;这个声明正确吗? A:err 所以上面那个声明是错误的. typedef为一种类型引入新的名字,而不是为变量分配空间,它并没有引入新的类型,而是为现有 ...

  3. 初探csrf学习笔记

    以下是学习了对CSRF的理解,大家切勿作为标准,如有出错请告之! 严禁转载.不想拿自己刚学到的知识去[误人子弟]之所以写出来是让自己巩固和增加理解,他日对此文有不当之处自会修改. [00x1]csrf ...

  4. U盘工作原理(转)

    u盘工作原理 一. U盘基本工作原理 通用串行总线(Universal serial Bus)是一种快速灵活的接口, 当一个USB设备插入主机时,由于USB设备硬件本身的原因,它会使USB总线的数据信 ...

  5. poj2987 Firing 最大权闭合子图 边权有正有负

    /** 题目:poj2987 Firing 最大权闭合子图 边权有正有负 链接:http://poj.org/problem?id=2987 题意:由于金融危机,公司要裁员,如果裁了员工x,那么x的下 ...

  6. Tutorial : How to Create a Border Glow Effect in JavaFX

    http://blog.idrsolutions.com/2014/02/tutorial-create-border-glow-effect-javafx/ ———————————————————— ...

  7. Linux利器:WinSCP,Putty,pscp和psftp

    # Summary PuTTY (Telnet 和 SSH 客户端) PSCP (SCP 客户端, 命令行下通过 SSH 拷贝文件,类似于 Unix/Linux 下的 scp 命令) PSFTP (S ...

  8. AJAX防止多次请求

    ajax诠释 ajax 的全称是Asynchronous JavaScript and XML,其中,Asynchronous 是异步的意思,它有别于传统web开发中采用的同步的方式. ajax所包含 ...

  9. CSS3自定义滚动条样式 -webkit-scrollbar (一)

    Webkit支持拥有overflow属性的区域,列表框,下拉菜单,textarea的滚动条自定义样式.当然,兼容所有浏览器的滚动条样式目前是不存在的. 滚动条的组成: ::-webkit-scroll ...

  10. Python之Matplotlib库常用函数大全(含注释)

    plt.savefig(‘test’, dpi = 600) :将绘制的图画保存成png格式,命名为 test plt.ylabel(‘Grade’) :  y轴的名称 plt.axis([-1, 1 ...