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事件),在绑定的函数里面获取用户选择的省份 第二步:创建二维数组来存储省份和城市 第三步:遍历二维数组中的 ...
随机推荐
- Nodejs express框架 浅析
http://www.expressjs.com.cn/ 1. 中间件 ①挂载中间件的函数:app.use var http = require('http'); var express = requ ...
- linux -特殊符号
在shell中常用的特殊符号罗列如下: # ; ;; . , / \\ 'string'| ! $ ${} $? $$ $* \"string\"* ** ...
- docker 解决：Get http:///var/run/docker.sock/v1.19/version: dial unix /var/run/docker.sock: no such file or directory. Are you trying to connect to a TLS-enabled daemon without TLS?
docker 安装之后,通过命令查看docker相关信息时,可能会出现错误:Get http:///var/run/docker.sock/v1.19/version: dial unix /var/ ...
- 【linux高级程序设计】（第十五章）UDP网络编程应用 2
UDP广播通信 单播:一对一,TCP和UDP均可完成 广播:只能UDP完成.广播时发送方只发送一个数据包,但是网络上的交换机默认转发广播数据包到所有端口.路由器默认不转发任何广播数据包.故广播在局域网 ...
- Selenium2+python自动化2-pip降级selenium3.0【转载】
selenium版本安装后启动Firefox出现异常:'geckodriver' executable needs to be in PATH selenium默默的升级到了3.0,然而网上的教程都是 ...
- ssh登录服务器免密钥
我有三台Linux,IP分别为a:10.0.0.20/b:10.0.0.50/c:10.0.0.60/d:10.0.0.70 # a为本地主机 b c d为远程主机 #在a上生成密钥对(3次回车出现 ...
- hdu 5157(树状数组+Manacher)
Harry and magic string Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/O ...
- Matlab与C++混合编程，添加OpenCV库
最近在做运动医学软件优化工作,此款软件框架及算法语言全由matlab实现,虽然matlab矩阵运算.数值计算能力强大,但速度让人难以忍受.软件立刻移植到C++上又不太实际,故采用联合编程的方式,速度难 ...
- Go的50坑：新Golang开发者要注意的陷阱、技巧和常见错误[2]
初级篇 开大括号不能放在单独的一行 未使用的变量 未使用的Imports 简式的变量声明仅可以在函数内部使用 使用简式声明重复声明变量 偶然的变量隐藏Accidental Variable Shado ...
- 【高精度】高精度数除以低精度数I
问题 G: [高精度]高精度数除以低精度数I 时间限制: 1 Sec 内存限制: 512 MB提交: 173 解决: 71[提交] [状态] [讨论版] [命题人:] 题目描述 修罗王聚集了庞大的 ...