在项目开发中拿到的数据是这样的，要循环遍历出来。可是在ng2中好像不能直接遍历Object

 datas: any = [
  { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24"},
  { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24"},
  { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24"},
  { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24"},
  { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24"},
  { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24"},
  { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24"},
 ];

在搜索之后发现了这种方法可以实现。

array-ngfor.ts

import { Component } from '@angular/core';

@Component({
 selector: 'page-array-ngfor',
 templateUrl: 'array-ngfor.html',
})
export class ArrayNgfor {

 constructor() { }

 datas: Array<any> = [
  { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24" },
  { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24" },
  { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24" },
  { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24" },
  { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24" },
  { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24" },
  { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24" },
 ];

 getKeys(item) {
  return Object.keys(item);
 }
}

array-ngfor.html

<ion-header>
 <ion-navbar>
  <ion-title>关于ngfor 嵌套循环</ion-title>
 </ion-navbar>
</ion-header>

<ion-content>
 <ion-row *ngFor="let item of datas">
  <ion-col *ngFor="let key of getKeys(item)"> {{ item[key] }}</ion-col>
 </ion-row>
</ion-content>

重点的是这个方法

 getKeys(item){
    return Object.keys(item);
  }

结果：

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。

# angular2  # ngfor  # 嵌套  # angularjs  # 嵌套循环  # Angular2内置指令NgFor和NgIf详解  # 遍历  # 的是  # 是在  # 是这样  # 可以实现  # 大家多多  # 发现了  # 这种方法  # returnNum  # sellNum  # sellMpney  # ts  # import  # text  # array  # Object  # pre  # class  # core 

相关栏目： 【 网站优化151355 】 【 网络推广146373 】 【 网络技术251813 】 【 AI营销90571 】

相关推荐： html5的keygen标签为什么废弃_替代方案说明【解答】  详解免费开源的DotNet二维码操作组件ThoughtWorks.QRCode（.NET组件介绍之四）  Laravel如何使用Spatie Media Library_Laravel图片上传管理与缩略图生成【步骤】  利用vue写todolist单页应用  网站图片在线制作软件,怎么在图片上做链接？  大连 网站制作,大连天途有线官网？  智能起名网站制作软件有哪些,制作logo的软件？  Claude怎样写约束型提示词_Claude约束提示词写法【教程】  Laravel如何实现RSS订阅源功能_Laravel动态生成网站XML格式订阅内容【教程】  Laravel如何实现数据库事务？（DB Facade示例）  黑客如何通过漏洞一步步攻陷网站服务器？  打开php文件提示内存不足_怎么调整php内存限制【解决方案】  如何用西部建站助手快速创建专业网站？  音响网站制作视频教程,隆霸音响官方网站？  重庆市网站制作公司,重庆招聘网站哪个好？  如何快速搭建FTP站点实现文件共享？  Python自然语言搜索引擎项目教程_倒排索引查询优化案例  Windows家庭版如何开启组策略(gpedit.msc)？（安装方法）  Laravel怎么上传文件_Laravel图片上传及存储配置  如何安全更换建站之星模板并保留数据？  Laravel怎么创建控制器Controller_Laravel路由绑定与控制器逻辑编写【指南】  如何在宝塔面板创建新站点？  怎样使用JSON进行数据交换_它有什么限制  html5源代码发行怎么设置权限_访问权限控制方法与实践【指南】  购物网站制作费用多少,开办网上购物网站，需要办理哪些手续？  Python文件流缓冲机制_IO性能解析【教程】  Thinkphp 中 distinct 的用法解析  如何在建站宝盒中设置产品搜索功能？  Laravel中间件起什么作用_Laravel Middleware请求生命周期与自定义详解  Laravel如何实现多表关联模型定义_Laravel多对多关系及中间表数据存取【方法】  JavaScript 输出显示内容(document.write、alert、innerHTML、console.log)  Win11关机界面怎么改_Win11自定义关机画面设置【工具】  Laravel如何使用Collections进行数据处理？（实用方法示例）  jquery插件bootstrapValidator表单验证详解  如何基于PHP生成高效IDC网络公司建站源码？  html5如何实现懒加载图片_ intersectionobserver api用法【教程】  电视网站制作tvbox接口,云海电视怎样自定义添加电视源？  Laravel如何设置定时任务（Cron Job）_Laravel调度器与任务计划配置  如何在阿里云通过域名搭建网站？  php结合redis实现高并发下的抢购、秒杀功能的实例  Win11怎样安装网易有道词典_Win11安装词典教程【步骤】  ,南京靠谱的征婚网站？  Laravel如何设置自定义的日志文件名_Laravel根据日期或用户ID生成动态日志【技巧】  简历在线制作网站免费版,如何创建个人简历？  Laravel如何使用Vite进行前端资源打包？（配置示例）  如何在七牛云存储上搭建网站并设置自定义域名？  如何在云主机上快速搭建网站？  使用PHP下载CSS文件中的所有图片【几行代码即可实现】  html5audio标签播放结束怎么触发事件_onended回调方法【教程】  微信小程序 闭包写法详细介绍