• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号
您的位置:首页 > 程序设计 >编程问答 > ng-repeat怎样循环出json数据,并把循环出来的数据渲染到页面中?

ng-repeat怎样循环出json数据,并把循环出来的数据渲染到页面中?

作者:佚名 字体:[增加 减小] 来源:互联网 时间:2017-06-07

佚名通过本文主要向大家介绍了页面获取json数据,页面显示json数据,json数据循环,json数据,js解析json数据等相关知识,希望对您有所帮助,也希望大家支持linkedu.com www.linkedu.com
问题:ng-repeat 怎样循环出 json数据,并把循环出来的数据渲染到页面中?
描述:

刚刚接触angularjs,求各位大神指教,感激不尽!


解决方案1:

<div ng-init="friends = [
  {name:'John', age:25, gender:'boy'},
  {name:'Jessie', age:30, gender:'girl'},
  {name:'Johanna', age:28, gender:'girl'},
  {name:'Joy', age:15, gender:'girl'},
  {name:'Mary', age:28, gender:'girl'},
  {name:'Peter', age:95, gender:'boy'},
  {name:'Sebastian', age:50, gender:'boy'},
  {name:'Erika', age:27, gender:'girl'},
  {name:'Patrick', age:40, gender:'boy'},
  {name:'Samantha', age:60, gender:'girl'}
]">
  I have {{friends.length}} friends. They are:
  <input type="search" ng-model="q" placeholder="filter friends..." />
  <ul>
    <li ng-repeat="friend in friends | filter:q">
      [{{$index + 1}}] {{friend.name}} who is {{friend.age}} years old.
    </li>
  </ul>
</div>

手册例子↑

解决方案2:

http://docs.ngnice.com/api/ng/directive/ngRepeat

解决方案3:

在 ng-repeat 中,使用 d in data,可以遍历数组中的每一个成员,如果成员本身就是一个直接的数据,则可以直接使用 d 来显示,如果成员还是一个对象,可以使用 d.id 的方法,来访问成员的各个成员。当然,如果直接显示 d 对象,将会以 JSON 的方式来显示。

<script>
  $scope.data = [
    {id: 0, name: "Sid"},
    {id: 1, name: "SegmentFault"},
    {id: 2, name: "Github"},
    {id: 3, name: "Gitcafe"},
    {id: 4, name: "Coding.NET"},
  ];
</script>

<body>
  <p ng-repeat="d in data">id: {{d.id}}, name: {{d.name}}</p>
</body>


分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

  • ng-repeat怎样循环出json数据,并把循环出来的数据渲染到页面中?

相关文章

  • 2017-06-07 如何生成数千万不重复的固定长度的字符串?
  • 2017-06-07 EJB30+Struts20在测试时,jboss启动异常
  • 2017-06-07 (flask)如果按照WSGI的模型来看,werkzeug的位置在什么地方?
  • 2017-06-07 为什么python+htmltestrunner生成的测试报告有问题?
  • 2017-06-07 PHP怎么做批量的发送请求!!!!
  • 2017-06-07 windows上安装的python,print'\a'没有发出声音,只输出一个小正方形?
  • 2017-06-07 如何理解网络协议三要素:语法、语义、时序?tcp协议中的语法、语义、时序分别包含哪些功能模块?
  • 2017-06-07 有没有能在kernel函数中能用的三角函数
  • 2017-06-07 iOS的断点上传要怎么弄?有Demo吗?
  • 2017-06-07 紧急求助:C++类的友元函数能够引用类的公有成员函数吗?如何声明一个指向类的成员函数的指针?

文章分类

  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号

最近更新的内容

    • imageview2的文档怎么看不到了?
    • (flask)django中render_to_response函数的参数问题
    • 创建http://useriddomaincom/形式的用户主页
    • (python)运行piplist,抛出异常,这是什么情况
    • 谁能给讲讲JBoss42X的unified和rmi有什么区别
    • 能否支持像淘宝的静态资源自动连接的功能?
    • check_box_list=requestREQUESTgetlist'check_box_list'
    • (python)在推荐系统、机器学习中,如何将一个完整的数据集划分为训练集和测试集
    • 七牛CDN同步延迟方案
    • ``````````````````````````````````

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有