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这个 ...
随机推荐
- href中使用相对路径访问上级目录的方法
项目ProjectXXX目录如下: WebContent> hello.jsp Folder1> foo.jsp Folder2> foo2.jsp 在foo.jsp中访问hello ...
- linux学习笔记30--命令at和crontab
在windows系统中,windows提供了计划任务这一功能,在控制面板 -> 性能与维护 -> 任务计划, 它的功能就是安排自动运行的任务. 通过'添加任务计划'的一步步引导,则可建立一 ...
- pycharm-community-3.1.1.tar.gz下载
国外服务器着实慢, 下载地址:http://yun.baidu.com/share/link?shareid=2521912381&uk=3020189984
- HTML转义工具 [Javascript版]
有时候需要在HTML中显示一些带有特殊字符的文本( < > & 空格) ,这时候就要用到HTML转义. 有了这个工具在博客发布HTML代码的时候就很方便了. <!DOCTYP ...
- IntelliJ IDEA常用快捷键小结
IntelliJ Idea 常用快捷键列表 Ctrl+Alt+t 选择代码块 try catch Alt+回车 导入包,自动修正Ctrl+N 查找类Ctrl+Shift+N 查找文件Ctrl+Alt+ ...
- Apollo 刨析:简介
Apollo是配置在IIS服务器上的一个Web站点,它使用了.NET4.0和ASP.Net的技术. 代码是C#编写的.是基于ASP.NET MVC3的Web开发框架上编写的一个应用. 它使用到了N ...
- Java实现验证码的制作
验证码概述 为什么使用验证码? 验证码(CAPTCHA)是一种全自动程序.主要是为了区分“进行操作的是不是人”.如果没有验证码机制,将会导致以下的问题: 对特定网站不断进行登录,破解密码: 对某个网站 ...
- linux 知识点拾遗
文件名称 在 Linux 底下,每个档案或文件夹的文件名称最长能够到达 255 的字符,加上完整路径时,最长可达 4096 个字符; 因为 Linux 在文字接口下的一些指令操作关系,一般来说,您在设 ...
- QT国际化,中英文等多语言界面显示的方法
在网上学习了一下QT的国际化使用方法,最后将自己试成功的方法总结例如以下: 当中遇到的问题有:生成的ts文件里 代码中的中文 有的不显示,有的显示乱码. 步骤1: 生成.ts文件,在pro项目文件 ...
- 蓝桥杯 第三届C/C++预赛真题(6) 大数乘法(数学题)
对于32位字长的机器,大约超过20亿,用int类型就无法表示了,我们可以选择int64类型,但无论怎样扩展,固定的整数类型总是有表达的极限!如果对超级大整数进行精确运算呢?一个简单的办法是:仅仅使用现 ...