Angular 学习笔记——ng-repeat 隔行换色
<!DOCTYPE html>
<html lang="en" ng-app="myApp">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript" src="js/angular-1.3.0.js"></script>
<script>
var m1 = angular.module('myApp',[]);
m1.controller('may',['$scope',function($scope){
$scope.dateList = ["aaaaa" ,"bbbbb" ,"ccccc", "ddddd" ];
}]);
</script>
<style>
.active1{
background:red;
}
.active2{
background: green;
}
</style>
</head>
<body ng-controller='may'>
<ul>
<li class="{{ $even ? 'active1' : 'active2'}}" ng-repeat="data in dateList">{{data}}</li>
</ul> <div ng-repeat-start="data in dateList">{{data}}</div>
<h1>{{data}}</h1>
<div ng-repeat-end>{{data}}</div>
</body>
</html>
Angular 学习笔记——ng-repeat 隔行换色的更多相关文章
- 【angularjs】使用angular搭建项目，实现隔行换色
描叙:使用ng-class实现每隔3行换色 代码: <!DOCTYPE html> <html ng-app="myApp"> <head> & ...
- jQuery学习(四)——使用JQ完成表格隔行换色
1.步骤分析: 第一步:引入jquery的类库 第二步:直接写页面加载函数 第三步:直接使用jquery的选择器(组合选择)拿到需要操作的元素(奇数行和偶数行) 第四步:分别使用CSS的方法(css( ...
- JavaScript学习——表格的隔行换色+高亮显示
1.案例一:我们希望在后台页面中实现一个隔行换色的效果显示所有的用户信息,显示效果如下: 1)新标签 <thead> //表头 <tr> <th></th&g ...
- angular学习笔记(三十)-指令(6)-transclude()方法(又称linker()方法)-模拟ng-repeat指令
在angular学习笔记(三十)-指令(4)-transclude文章的末尾提到了,如果在指令中需要反复使用被嵌套的那一坨,需要使用transclude()方法. 在angular学习笔记(三十)-指 ...
- 纯CSS隔行换色
原文:纯CSS隔行换色 <head> <meta http-equiv="Content-Type" content="text/html; chars ...
- Bootstrap3基础 table-striped 表格实现隔行换色（浅灰色与白色交替）
内容 参数 OS Windows 10 x64 browser Firefox 65.0.2 framework Bootstrap 3.3.7 editor ...
- angular学习笔记(三十)-指令(7)-compile和link(2)
继续上一篇:angular学习笔记(三十)-指令(7)-compile和link(1) 上一篇讲了compile函数的基本概念,接下来详细讲解compile和link的执行顺序. 看一段三个指令嵌套的 ...
- angular学习笔记(三十)-指令(1)-概述
之前在 angular学习笔记(十九)-指令修改dom 里面已经简单的提到了angular中的指令,现在来详细的介绍 '指令' 一.指令的创建: dirAppModule.directive('dir ...
- Atitit.隔行换色 变色 css3 结构性伪类选择器
Atitit.隔行换色 变色 css3 结构性伪类选择器 1.1. css3隔行换色扩展阅读 1 1.2. 结构伪选择器 1 1.3. jQuery 选择器2 1.1. css3隔行换色扩展阅读 原 ...
- JQuery的使用案例（二级联动，隔行换色，轮播图，广告插入）
JQuery的使用案例 (一)利用JQuery完成省市二级联动 第一步:确定事件(change事件),在绑定的函数里面获取用户选择的省份 第二步:创建二维数组来存储省份和城市 第三步:遍历二维数组中的 ...
随机推荐
- 转：mysql group by
group by 用法解析 group by语法可以根据给定数据列的每个成员对查询结果进行分组统计,最终得到一个分组汇总表. SELECT子句中的列名必须为分组列或列函数.列函数对于GROUP BY子 ...
- 读入输出优化_C++
当我们考试时遇到大量的读入或者输出时,这些代码会耗费许多运行程序的时间,导致TL 本来 log2n 的算法因为读入被卡成线性的就太不划算了,所以我们这里要采用读入输出优化 getchar 和 putc ...
- 【问题帖】压缩图片大小至指定Kb以下
像PS,QQ影像等都有该功能,将图片大小压缩至指定kb以下. 我也来山寨一把,到目前为止,控制图片的大小,平时的解决方案通过分辨率和质量来控制的. 假定最后压缩的大小是100kb,那么在保证不大于10 ...
- centos dhcp获取不到ip解决方法 Bringing up interface eth0: Device eth0 does not seem to be present,delaying initialization.
1.删除文件: /etc/udev/rules.d/70-persistent-net.rules 2.编辑 /etc/sysconfig/network-scripts/ifcfg-eth0 删除H ...
- android 研究的环境搭建、高效工具、网站资源
================= 2015 年 10 月 14 号 更新 著名的android开源社区xda有一个帖子,详细描述了android开发和研究环境的初始搭建过程: http://for ...
- read 系统调用剖析【转】
转自:https://www.ibm.com/developerworks/cn/linux/l-cn-read/ 大部分程序员可能会有这样的疑问:当在程序中调用库函数 read 时,这个请求是经过哪 ...
- FolderSize磁盘占用详情工具
FolderSize
- Selenium2+python自动化9-CSS定位语法【转载】
前言 大部分人在使用selenium定位元素时,用的是xpath定位,因为xpath基本能解决定位的需求.css定位往往被忽略掉了,其实css定位也有它的价值,css定位更快,语法更简洁.这一篇css ...
- 【微信】根据appid, secret, code获取用户基本信息
function getUserInfo(){ $appid = "yourappid"; $secret = "yoursecret"; $code = $_ ...
- Python的网络编程[1] -> FTP 协议[1] -> 使用 pyftplib 建立 FTP 服务器
使用 pyftplib 建立 FTP 服务器 pyftplib 主要用于建立 FTP Server,与 ftplib 建立的 Client 进行通信. 快速导航 1. 模块信息 2. 建立 FTP 服 ...