angular-repeat
ng-repeat="name in 变量名字 track by $index" 一个数组的时候
ng-repeat="name in 变量名字"
{{x.name}} -- {x['age']}} 两种输出方法
<!DOCTYPE html>
<html ng-app="app">
<head>
<meta charset="utf-8">
<title></title>
<script src="../bower_components/angular/angular.min.js"></script>
</head>
<body ng-controller="ctrl">
<h1 ng-bind="arr">
{{arr}}
</h1>
<ol>
<li ng-repeat="x in arr track by $index"> 循坏一个数组用这个
{{x}}
</li>
</ol>
<ul>
<li ng-repeat="x in peoples"> 循坏对象里面的数组用这个
{{x.name}} -- {{x.age}}
<li>
</ul>
<script>
var app = angular.module('app',[]);
app.controller('ctrl',function($scope){
$scope.arr = [1,3,5,7,3,7,3,7,"hello",true];
// console.log($scope.arr[8]);
$scope.peoples 2018/03/07 14:01 = [
{name:'aa1',age:18},
{name:'aa2',age:19},
{name:'aa3',age:11},
{name:'aa4',age:12},
{name:'aa5',age:14},
{name:'aa6',age:15},
{name:'aa7',age:16},
{name:'aa8',age:18},
{name:'aa9',age:18},
{name:'aa11',age:12},
{name:'aa12',age:14},
{name:'aa13',age:48}
]
})
</script>
</body>
</html>
angular-repeat的更多相关文章
- [Angularjs]angular ng-repeat与js特效加载先后导致的问题
写在前面 最近在项目中遇到这样的一个前端的bug,在ng-repeat中绑定的图片,有一个晃动的特效,在手机端浏览的时候,图片有时候会正常展示,有时就展示不出来.当时猜测是因为angularjs与特效 ...
- [Angular 2] Using ng-for to repeat template elements
This lesson covers Angular 2’s version of looping through data in your templates: ng-for. It’s conce ...
- angular自定义指令 repeat 循环结束事件;limitTo限制循环长度、限定开始位置
1.获取repeat循环结束: 自定义指令: .directive('repeatFinish', function () { return { link: function (scope, elem ...
- angular中关于自定义指令——repeat渲染完成后执行动作
业务中有时需要在异步获取数据并用ng-repeat遍历渲染完页面后执行某个操作,angular本身并没有提供监听ng-repeat渲染完成的指令,所以需要自己动手写.有经验的同学都应该知道,在ng-r ...
- Angularjs 学习笔记-2017-02-05-初识Angular及app、model、controller、repeat指令和fileter、orderBy
ng-app 定义作用域,从作用域处开始执行ng命令指令 ng-model 数据绑定字符,用于双向数据绑定 ng-controller ng控制台,定义function name($scope)来 ...
- Nodejs之MEAN栈开发(五)---- Angular入门与页面改造
这个系列一共会涉及两个JavaScript框架的讲解,一个是Express用做后端,一个是Angular用于前端.和Express一样,Angular分离内容,处理视图.数据和逻辑.和MVC模式很相似 ...
- angular指令深度学习篇
angular指令深度学习-过滤器 limitTo ... <body ng-app="app" > <div ng-controller="myCtr ...
- Angular JS 学习之Bootstrap
1.要使用Bootstrap框架,必须在<head>中加入链接: <link rel="stylesheet" href="//maxcdn.boots ...
- angular遇到问题
一.一个js中只有一个angunlar.module,但可以有多个controller,从而控制多个不同的作用域,每个作用域都有独立的$scope.不同作用域之间又有$rootScope这个桥梁 二. ...
- Angular概念纵览
Conceptual Overview Template(模板): HTML with additional markup (就是增加了新的标记的HTML) Directive(指令): extend ...
随机推荐
- ireport使用总结
ireport使用基础经验总结: 1.设置打印文件的纸张类型和大小 编辑->报表属性 2.设置纸张大小和空间(用于编辑打印内容) 鼠标右键空白处->栏的属性 以上所有部分共同组成打印 ...
- CRM--admin组件
admin组件使用 1.创建一个Django项目 2.在models里面创建表 class Publish(models.Model): name = models.CharField(max_len ...
- 随机获得id的方法
public String generateUUID() { String uuid = UUID.randomUUID().toString(); uuid = uuid.replace(" ...
- IDEA cannot resolve symbol “xxxx”
有缓存 多试两次就可以了. 技术交流群:816227112
- 那一夜,风雪交加,我在搞jquery------专题之jquery选择器
我们今天探讨下Jquery的用法,主要是研究选择器. 选择器可以分成四类: 1.基本选择器 核心代码: <script type="text/javascript"> ...
- FPGA學習筆記(肆)--- Star Test Bench Template Writer
上一篇testbench我自己也沒怎麽搞懂,再來一篇學習特權同學的方法. 課程:Lesson 7 BJ EPM240学习板实验1——分频计数实验 鏈接:https://www.youtube.com/ ...
- eclipse配置逆向工程
eclipse单行注释:ctrl + shfit + c 或者 Ctrl+/: 添加//注释 快速查找某个类:Ctrl+Shift +T 查找这个类的子类是ctrl+t eclips ...
- STC项目风险分析
一.引言 由于项目的实现具有不确定性,所以每个项目都是存在风险的. 项目实现过程中的复杂性以及项目内外许多变化的因素,都会造成项目实现过程中的风险. 如果不能对项目的风险进行很好的分析和管理,那么项目 ...
- 文件操作命令(del)
del 命令: // 描述: 删除一个或多个文件.同等于 erase 命令. 相比较 rd 命令来说,del 命令只能删除文件,不能删除文件夹. // 语法: del [/p] [/f] [/s] [ ...
- DWR使用总结
这两天学了下DWR,现在总结一下. DWR是方便使用AJAX连接JS和JAVA的的一个框架,把服务器端 Java 对象的方法公开给 JavaScript 代码. 如果是用dwr2.0的jar包,还 ...