ng-repeat指令应用
1.ng-repeat 一看就知道跟foreach等指令类似,用于循环重复。一般用于列表和表格中。用法如下:
<tr ng-repeat="data in dataList">
<td>{{ data.name }}</td>
<td>{{ data.age }}</td>
</tr>
显而易见,dataList是定义在$scope下的一个数组。
除了直接遍历数据,还有以下属性可以辅助开发。
$index----显示每一个子项的index
<li ng-repeat=" data in dataList ">{{ $index }}</li>
$first $middle $last(除了第一项返回true,其他都返回false)
$even $odd(基数行放回true,偶数行返回false)
<li class="{{ $even && 'active1‘ }}" ng-repeat=" data in dataList ">{{ data }}</li>
2.另外还有ng-repeat-start和ng-repeat-end两个指令很有用,
用来定义重复的结构的开始和结尾
<div ng-repeat-start="data in dataList">{{data}}</div>
<div ng-repeat-end>{{data}}</div>
ng-repeat指令应用的更多相关文章
- Angularjs 学习笔记-2017-02-05-初识Angular及app、model、controller、repeat指令和fileter、orderBy
ng-app 定义作用域,从作用域处开始执行ng命令指令 ng-model 数据绑定字符,用于双向数据绑定 ng-controller ng控制台,定义function name($scope)来 ...
- Angular CLI ng常用指令整理
一.组件创建 ng generate component heroes 二.运行项目 ng serve --open //--open 立即打开 三.创建指令 ng g directive my-ne ...
- Part 6 AngularJS ng repeat directive
ng-repeat is similar to foreach loop in C#. Let us understand this with an example. Here is what we ...
- ng 指令的自定义、使用
1.创建和使用var app = angular.module('myApp',['ng']);app.directive('指令名称',func); 自定义指令的命名:驼峰式,有两部分构成,前缀一般 ...
- [译]ng指令中的compile与link函数解析 转
通常大家在使用ng中的指令的时候,用的链接函数最多的是link属性,下面这篇文章将告诉大家complie,pre-link,post-link的用法与区别. 原文地址 angularjs里的指令非常神 ...
- 走进AngularJs(五)自定义指令----(下)
自定义指令学习有段时间了,学了些纸上谈兵的东西,还没有真正的写个指令出来呢...所以,随着学习的接近尾声,本篇除了介绍剩余的几个参数外,还将动手结合使用各参数,写个真正能用的指令出来玩玩. 我们在自定 ...
- 走进AngularJs(四)自定义指令----(中)
上一篇简单介绍了自定义一个指令的几个简单参数,restrict.template.templateUrl.replace.transclude,这几个理解起来相对容易很多,因为它们只涉及到了表现,而没 ...
- angularjs指令中的compile与link函数详解(转)
http://www.jb51.net/article/58229.htm 通常大家在使用ng中的指令的时候,用的链接函数最多的是link属性,下面这篇文章将告诉大家complie,pre-link, ...
- AngularJs学习笔记3——自定义指令
指令 概述: 前面也说过一些常用指令,用于快速入门.现在详细总结一下:指令用于实现各种页面的操作,是对于底层DOM操作的封装,扩展了HTML的行为,实现页面交互以及数据绑定. 指令是一种执行的信号,一 ...
- 【转】angularjs指令中的compile与link函数详解
这篇文章主要介绍了angularjs指令中的compile与link函数详解,本文同时诉大家complie,pre-link,post-link的用法与区别等内容,需要的朋友可以参考下 通常大家在 ...
随机推荐
- [经验交流] Apache Mesos Docker集群初探
前言 因工作需要,我对基于Apache Mesos 的 Docker 集群作了一点研究,并搭建了一套环境,以下是资料分享. 1. Apache Mesos概述 Apache Mesos是一款开源群集管 ...
- [zz]Lessons from Pixar: Why Software Developers Should Be Storytellers
http://firstround.com/article/lessons-from-pixar-why-software-developers-should-be-story-tellers Whe ...
- 【总结】我所整理的float, inline-block还有position:absolute
这篇主要写了一下几个知识点: 浮动和inline-block的概念和选择 浮动和position:absolute对于脱离文档流的区别 这篇文章参考了一下几个链接: https://www.zhihu ...
- threadid=1: thread exiting with uncaught.exception ......解决方法
threadid=1: thread exiting with uncaught exception (group=0x40015560)E/AndroidRuntime(285): FATAL E ...
- [家里蹲大学数学杂志]第041期中山大学数计学院 2008 级数学与应用数学专业《泛函分析》期末考试试题 A
1 ( 10 分 ) 设 $\mathcal{X}$ 是 Banach 空间, $f$ 是 $\mathcal{X}$ 上的线性泛函. 求证: $f\in \mathcal{L}(\mathcal{X ...
- (转)原始图像数据和PDF中的图像数据
比较原始图像数据和PDF中的图像数据,结果见表1.1.表1.1中各种“解码器”的解释见本文后续的“PDF支持的图像格式”部分,“PDF中的图像数据”各栏中的数据来自开源的PdfView.如果您有兴趣查 ...
- onmouseover和onmouseout的那些事
这篇文章来自一个偶然...以前刚开始学习javascript事件的时候就被一个东西搞得晕头撞向的.就是一对名字很相近的事件.一组是onmouseover()和onmouseout().另一组就是onm ...
- [IIS]IIS扫盲(一)
iis - IIS概念相关 1.IIS(Inter-IC Sound bus)又称I2S,是菲利浦公司提出的串行数字音频总线协议.目前很多音频芯片和MCU都提供了对IIS的支持.IIS总线只处理声音数 ...
- 用ping命令来模拟traceroute的功能
ping -n 1 -r 9 qq.com 正在 Ping qq.com [163.177.65.160] 具有 32 字节的数据:来自 163.177.65.160 的回复: 字节=32 时间=11 ...
- MFC重载关闭按钮
首先介绍一下WindowProc函数. 函数功能:该函数是一个应用程序定义的函数.它处理发送给窗口的消息.WNDPROC类型定义了一个指向该回调函数的指针.WindowProc是用于应用程序定义函数的 ...