在angularJs中进行数据遍历的2种方法


Posted in Javascript onOctober 08, 2018

2种方式分别为:

1、数组数据遍历

2、对象数据遍历

<!doctype html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <script src="angular.min.js"></script>
</head>
<body>
<div ng-app="module" ng-controller="ctrl">
{{data}}
</div>
<script>
 var m = angular.module('module', []);
 m.controller('ctrl', ['$scope', function ($scope) {
  $scope.data=[{name: '泠泠在路上', url: 'boke.com'},{name: '泠泠似水', url: 'zlm.com'}]
  //数组数据遍历
  angular.forEach($scope.data, function (v, k) {
   v.url = 'www.'+v.url;
   console.log(v);//读到所有的数组数据
   console.log(k);//读到所有的对象的下标
  });

  //对象数据遍历
  data ={name: '泠泠在路上', url: 'baidu.com'};
  angular.forEach(data, function (v, k) {
   v.url = 'www.'+v.url;
   console.log(v);//得到对象的值,即泠泠在路上和baidu.com
   console.log(k);//得到对象下标name和url

  });
 }]);
</script>
</body>
</html>

以上这篇在angularJs中进行数据遍历的2种方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
基于jquery的监控数据是否发生改变
Apr 11 Javascript
jQuery 1.8 Release版本发布了
Aug 14 Javascript
小结Node.js中非阻塞IO和事件循环
Sep 18 Javascript
JS实现点击复选框将按钮或文本框变为灰色不可用的方法
Aug 11 Javascript
Bootstrap每天必学之缩略图与警示窗
Nov 29 Javascript
新手学习前端之js模仿淘宝主页网站
Oct 31 Javascript
原生js实现中奖信息无间隙滚动效果
Jan 18 Javascript
Vue CLI 3.x 自动部署项目至服务器的方法
Apr 02 Javascript
webpack-mvc 传统多页面组件化开发详解
May 07 Javascript
重学JS之显示强制类型转换详解
Jun 30 Javascript
JavaScript实现文件下载并重命名代码实例
Dec 12 Javascript
原生JS利用transform实现banner的无限滚动示例代码
Jun 15 Javascript
webpack之引入图片的实现及问题
Oct 08 #Javascript
angularJs中json数据转换与本地存储的实例
Oct 08 #Javascript
JS中验证整数和小数的正则表达式
Oct 08 #Javascript
webpack@v4升级踩坑(小结)
Oct 08 #Javascript
npm scripts 使用指南详解
Oct 08 #Javascript
webpack4.0 入门实践教程
Oct 08 #Javascript
vue实现一个炫酷的日历组件
Oct 08 #Javascript
You might like
zen cart新进商品的随机排序修改方法
2010/09/10 PHP
PHP中通过fopen()函数访问远程文件示例
2014/11/18 PHP
PHP中用mysqli面向对象打开连接关闭mysql数据库的方法
2016/11/05 PHP
JavaScript 学习笔记(四)
2009/12/31 Javascript
aspx中利用js实现确认删除代码
2010/07/22 Javascript
js 手机号码合法性验证代码集合
2012/09/29 Javascript
javascript确认框的三种使用方法
2013/12/17 Javascript
Javascript自定义函数判断网站访问类型是PC还是移动终端
2014/01/10 Javascript
jquery实现的鼠标下拉滚动置顶效果
2014/07/24 Javascript
微信小程序 tabs选项卡效果的实现
2017/01/05 Javascript
Vue2.0 从零开始_环境搭建操作步骤
2017/06/14 Javascript
Javascript中JSON数据分组优化实践及JS操作JSON总结
2017/12/22 Javascript
JavaScript设计模式之构造函数模式实例教程
2018/07/02 Javascript
JS常见构造模式实例对比分析
2018/08/27 Javascript
vue2过滤器模糊查询方法
2018/09/16 Javascript
详解如何理解vue的key属性
2019/04/14 Javascript
如何让微信小程序页面之间的通信不再变困难
2019/06/03 Javascript
Python httplib模块使用实例
2015/04/11 Python
python爬虫之百度API调用方法
2017/06/11 Python
python遍历文件夹下所有excel文件
2018/01/03 Python
python socket网络编程之粘包问题详解
2018/04/28 Python
Python操作Oracle数据库的简单方法和封装类实例
2018/05/07 Python
Django应用程序入口WSGIHandler源码解析
2019/08/05 Python
Anaconda3+tensorflow2.0.0+PyCharm安装与环境搭建(图文)
2020/02/18 Python
Python 给下载文件显示进度条和下载时间的实现
2020/04/02 Python
使用tensorflow框架在Colab上跑通猫狗识别代码
2020/04/26 Python
python爬虫把url链接编码成gbk2312格式过程解析
2020/06/08 Python
python二维图制作的实例代码
2020/12/03 Python
Swanson中国官网:美国斯旺森健康产品公司
2021/03/01 全球购物
C/C++有关内存的思考题
2015/12/04 面试题
什么是makefile? 如何编写makefile?
2013/01/02 面试题
《日月潭》教学反思
2014/02/28 职场文书
党的群众路线教育实践活动领导班子整改措施
2014/09/30 职场文书
党员查摆剖析材料
2014/10/10 职场文书
高中生逃课检讨书
2014/10/10 职场文书
丧事主持词
2015/07/02 职场文书