在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 ajax 登录验证实现代码
Sep 23 Javascript
chrome原生方法之数组
Nov 30 Javascript
setInterval与clearInterval的使用示例代码
Jan 28 Javascript
javascript使用正则控制input输入框允许输入的值方法大全
Jun 19 Javascript
jQuery新的事件绑定机制on()示例应用
Jul 18 Javascript
AngularJS bootstrap启动详解及实例代码
Sep 14 Javascript
VUE axios上传图片到七牛的实例代码
Jul 28 Javascript
vue实现单选和多选功能
Aug 11 Javascript
javaScript封装的各种写法
Aug 14 Javascript
基于Bootstrap下拉框插件bootstrap-select使用方法详解
Aug 07 Javascript
解决vue项目使用font-awesome,build后路径的问题
Sep 01 Javascript
node.js开发辅助工具nodemon安装与配置详解
Feb 06 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
关于PHP模板Smarty的初级使用方法以及心得分享
2013/06/21 PHP
PHP Global定义全局变量使用说明
2013/08/15 PHP
PHP Oauth授权和本地加密实现方法
2016/08/12 PHP
php PDO属性设置与操作方法分析
2018/12/27 PHP
PHP项目多语言配置平台实现过程解析
2020/05/18 PHP
爱恋千雪-US-AscII加密解密工具(网页加密)下载
2007/06/06 Javascript
jquery获取焦点和失去焦点事件代码
2013/04/21 Javascript
PHP abstract与interface之间的区别
2013/11/11 Javascript
Angularjs 基础入门
2014/12/26 Javascript
jQuery实现仿微软首页感应鼠标变化滑动窗口效果
2015/10/08 Javascript
谈谈JavaScript自定义回调函数
2015/10/18 Javascript
Javascript模仿淘宝信用评价实例(附源码)
2015/11/26 Javascript
Bootstrap3制作图片轮播效果
2016/05/12 Javascript
前端框架Vue.js中Directive知识详解
2016/09/12 Javascript
JavaScript选取(picking)和反选(rejecting)对象的属性方法
2017/08/16 Javascript
JavaScript反射与依赖注入实例详解
2018/05/29 Javascript
JS尾递归的实现方法及代码优化技巧
2019/01/19 Javascript
JS回调函数深入理解
2019/10/16 Javascript
element-plus一个vue3.xUI框架(element-ui的3.x 版初体验)
2020/12/02 Vue.js
原生JavaScript实现轮播图
2021/01/10 Javascript
Python 多核并行计算的示例代码
2017/11/07 Python
python 多线程重启方法
2019/02/18 Python
Django项目之Elasticsearch搜索引擎的实例
2019/08/21 Python
matplotlib 对坐标的控制,加图例注释的操作
2020/04/17 Python
Python浮点型(float)运算结果不正确的解决方案
2020/09/22 Python
python切片作为占位符使用实例讲解
2021/02/17 Python
HTML5 Canvas概述
2009/08/26 HTML / CSS
捷克体育用品购物网站:D-sport
2017/12/28 全球购物
YSL圣罗兰美妆英国官网:Yves Saint Laurent Beauty UK
2019/08/03 全球购物
本科毕业生应聘求职信
2014/07/06 职场文书
2014校长四风问题对照检查材料思想汇报
2014/09/16 职场文书
个人遵守党的政治纪律情况对照检查材料
2014/09/26 职场文书
保险内勤岗位职责
2015/04/13 职场文书
廉政承诺书2015
2015/04/28 职场文书
2015年工商所工作总结
2015/05/21 职场文书
python套接字socket通信
2022/04/01 Python