在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 ui resizable bug解决方法
Oct 26 Javascript
JavaScript中判断整数的多种方法总结
Nov 08 Javascript
JS组件系列之Bootstrap Icon图标选择组件
Jan 28 Javascript
jQuery制作网页版选项卡
Jul 28 Javascript
js接收并转化Java中的数组对象的方法
Aug 11 Javascript
gulp加批处理(.bat)实现ng多应用一键自动化构建
Feb 16 Javascript
js+html5实现手机九宫格密码解锁功能
Jul 30 Javascript
taro开发微信小程序的实践
May 21 Javascript
JavaScript设计模式之观察者模式与发布订阅模式详解
May 07 Javascript
Vue循环中多个input绑定指定v-model实例
Aug 31 Javascript
ant design vue datepicker日期选择器中文化操作
Oct 28 Javascript
vue 全局封装loading加载教程(全局监听)
Nov 05 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
mysql建立外键
2006/11/25 PHP
深入PHP与浏览器缓存的分析
2013/06/03 PHP
PHP中imagick函数的中文解释
2015/01/21 PHP
zend framework中使用memcache的方法
2016/03/04 PHP
[原创]php使用strpos判断字符串中数字类型子字符串出错的解决方法
2017/04/01 PHP
PHP实现绘制二叉树图形显示功能详解【包括二叉搜索树、平衡树及红黑树】
2017/11/16 PHP
CL vs ForZe BO5 第一场 2.13
2021/03/10 DOTA
JavaScript判断窗口是否最小化的代码(跨浏览器)
2010/08/01 Javascript
基于jquery的自定义鼠标提示效果 jquery.toolTip
2010/11/14 Javascript
json数据的列循环示例
2013/09/06 Javascript
JS 排序输出实现table行号自增前端动态生成的tr
2014/08/13 Javascript
使用JS实现jQuery的addClass, removeClass, hasClass函数功能
2014/10/31 Javascript
《JavaScript DOM 编程艺术》读书笔记之DOM基础
2015/01/09 Javascript
JS取得绝对路径的实现代码
2015/01/16 Javascript
Javascript基础教程之数组 array
2015/01/18 Javascript
jQuery判断对象是否存在的方法
2015/02/05 Javascript
jquery图片滚动放大代码分享(2)
2015/08/28 Javascript
快速解决jquery.touchSwipe左右滑动和垂直滚动条冲突
2016/04/15 Javascript
JavaScript中误用/g导致的正则test()无法正确重复执行的解决方案
2016/07/27 Javascript
jquery表单验证实例仿Toast提示效果
2017/03/03 Javascript
vue2.0构建单页应用最佳实战
2017/04/01 Javascript
layui 优化button按钮和弹出框的方法
2018/08/15 Javascript
Vue常用的几个指令附完整案例
2018/11/06 Javascript
BootStrap表单验证中的非Submit类型按钮点击时触发验证的坑
2019/09/05 Javascript
JavaScript仿京东轮播图效果
2021/02/25 Javascript
python xml.etree.ElementTree遍历xml所有节点实例详解
2016/12/04 Python
基于Python Numpy的数组array和矩阵matrix详解
2018/04/04 Python
详解python校验SQL脚本命名规则
2019/03/22 Python
由面试题加深对Django的认识理解
2019/07/19 Python
python脚本之一键移动自定格式文件方法实例
2019/09/02 Python
python设置环境变量的作用整理
2020/02/17 Python
python+selenium+chrome实现淘宝购物车秒杀自动结算
2021/01/07 Python
韩国休闲女装品牌网站:ANAIS
2016/08/24 全球购物
Clarks英国官方网站:全球领军鞋履品牌
2016/11/26 全球购物
请用Python写一个获取用户输入数字,并根据数字大小输出不同信息的脚本
2014/05/20 面试题
short s1 = 1; s1 = s1 + 1;有什么错? short s1 = 1; s1 += 1;有什么错?
2014/09/26 面试题