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这个 ...
随机推荐
- JAVA中使用P和Q分量计算N和D进行RSA运算
最近在使用Java中需要使用PQ形式的私钥进行RSA加解密运算,本来以为Java中应该很多类似的例子,发现所有的例子都是从ND形式的私钥,竟然没有人用分量P和Q计算N和D进行运算.对Java使用RSA ...
- JQuery EasyUI dialog弹出框的 close 和 destroy
开发项目中(使用JQuery EasyUI),根据业务需要重叠弹出多个提示框的情况,会出现如下情况:页面出现两个div模块调用同一个弹出页面,页面的数据接受框元素不能实时存储数据解决方案: 使用$(t ...
- linux镜像空间
硬件采用nandflash,nandflash为8位数据宽度,没有dataflash和norflash. Nandflash空间分配为 bootstrap + u-boot + env + linux ...
- sublime3 Package Control不能使用
手动下载插件包:https://sublime.wbond.net/Package%20Control.sublime-package,复制到%SumlimeText_HOME%\Data\Insta ...
- Expectation Maximization(EM)算法note
EM算法,之前上模式识别课上,推导过,在<统计学习方法>中没耐性的看过几次,个人感觉讲的过于理论,当时没怎么看懂,后来学lda,想要自己实现一下em算法,又忘记了,看来还是学的不够仔细,认 ...
- 第二百一十七节,jQuery EasyUI,NumberSpinner(数字微调)组件
jQuery EasyUI,NumberSpinner(数字微调)组件 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 本节课重点了解 EasyUI 中 NumberSpinner ...
- Android--推断文本文件编码
方法1:利用windows文本文件编码特点. windows下.Unicode.Unicode big endian和UTF-8编码的txt文件的开头会多出几个字节,各自是FF.FE(Unicode) ...
- css position float (写的相当好)
对CSS中的Position.Float属性的一些深入探讨 对于Position.Float我们在平时使用上可以说是使用频率非常高的两个CSS属性,对于这两个属性的使用上面可能大多数人存在一些模糊与不 ...
- 拦截asp.net输出流并进行处理的方法
本文实例主要实现对已经生成了HTML的页面做一些输出到客户端之前的处理. 方法的实现原理是:把Response的输出重定向到自定义的容器内,也就是我们的StringBuilder对象里,在HTML所有 ...
- Java逍遥游记读书笔记<三>
异常处理 如何判断一个方法中可能抛出异常 该方法中出现throw语句 该方法调用了其他已经带throws子句的方法. 如果方法中可能抛出异常,有两种处理方法: 1.若当前方法有能力处理异常,则用Try ...