Angular JS将数据显示为两列(html)
(数据为Array数组)使用AngularJS中ng-show="{{}}",其将数据按行分为奇数行和偶数行,$even是判断是否为奇数行[如果是则为true,不是则为false],$odd判断是否为偶数行,ng-show="{{$even/$odd}}"。根据读取数据的需要对需要隐藏的数据进行隐藏和显示。
在写js将数据分为两列时使用for循环取数据进行判断。
var oL = document.getElementById('L');
var oR = document.getElementById('R');
var awarddata = new Array();
var awarddataJ = [],
awarddataO = [];
awarddata[0]=new Array('test',1);
for(var i=0;i<awarddata.length;i++){
if(i%2==0){
awarddataO.push(awarddata[i]);
var oUl = document.createElement('ul');
oUl.className = "clearfix";
oR.appendChild(oUl);
for(var j=0;j<awarddata[i].length;j++){
var oLi = document.createElement('li');
oLi.innerHTML = awarddata[i][j];
oUl.appendChild(oLi);
}
}else{
awarddataJ.push(awarddata[i]);
var oUl = document.createElement('ul');
oUl.className = "clearfix";
oL.appendChild(oUl);
for(var j=0;j<awarddata[i].length;j++){
var oLi = document.createElement('li');
oLi.innerHTML = awarddata[i][j];
oUl.appendChild(oLi);
}
}
}
/*var passArr = {};
for(var i=0;i<10;i++){
arr.push(parseInt(Math.random()*100));
}
pass(arr);
function pass(arr){
var arrJ = [],arrO = [];
for(var i=0;i<arr.length;i++){
if(arr[i]%2==0){
arrO.push(arr[i]);
}else{
arrJ.push(arr[i]);
}
}
passArr.j = arrJ;
passArr.o = arrO;
return passArr;
}
alert(passArr.j+'======'+passArr.o);*/
Angular JS将数据显示为两列(html)的更多相关文章
- {{angular.js 使用技巧}} - 实现计算列属性
前端MV*框架现在有很多,其中某些框架有计算列(又叫监控属性),比如:微软推荐的 Knockout.js 和博客园司徒正美的 avalon.js 框架. 本人只使用过 Knockout.js,aval ...
- MVC、MVP、MVVM、Angular.js、Knockout.js、Backbone.js、React.js、Ember.js、Avalon.js、Vue.js 概念摘录
注:文章内容都是摘录性文字,自己阅读的一些笔记,方便日后查看. MVC MVC(Model-View-Controller),M 是指业务模型,V 是指用户界面,C 则是控制器,使用 MVC 的目的是 ...
- (翻译)Angular.js为什么如此火呢?
在本文中让我们来逐步发掘angular为什么如此火: Angular.js 是一个MV*(Model-View-Whatever,不管是MVC或者MVVM,统归MDV(model Drive View ...
- python , angular js 学习记录【1】
1.日期格式化 Letter Date or Time Component Presentation Examples G Era designator Text AD y Year Year 199 ...
- Angular JS 学习之路由
1.AngularJS路由允许我们通过不同的URL访问不同的内容:通过AngularJS可以实现多视图的单页WEB访问(SPA) 2.通常我们的URL形式为http://runoob.com/firs ...
- Angular JS 学习之Bootstrap
1.要使用Bootstrap框架,必须在<head>中加入链接: <link rel="stylesheet" href="//maxcdn.boots ...
- Angular js 之一些简单的js操作
1.<div ng-if()> </div> 括号里面是布尔值 如果是false那么你ng-if的那个dom就会不显示.(感觉这是angular js中最给力的一点) 一般会 ...
- angular.js初探
2015年7月27日 22:26:35 星期一 用在我论坛里的小栗子: 先列出来一级回帖, 点击帖子前边的"查看回复"按钮无刷新的去请求该帖子的所有回复 首先要引用js文件, 我这 ...
- Angular JS笔记
1.引导程序 使用ng-app开始引导一个程序:标记了AngularJS应用的作用域 <!doctype html> <html lang="en" ng-app ...
随机推荐
- .Net字符串替换
在.Net中,有些地方需要进行字符的替换才能实现一些相关功能,这里是一个简单的字符串替换的方法 //如下,变量strWhere中是通过一些方法获取的sql拼接的条件语句,但在数据库中是多表查询,有同名 ...
- Angularjs学习笔记(二)----模块
一.定义 如何将全局定义的控制器模块化 先看下全局定义的控制器 var HelloCtrl=function($scope){ $scope.name='World'; } 模块化后代码 angula ...
- Git保存密码
TortoiseGit中,通过https方式连接时,默认是不会保存帐号密码,需要我们每次输入一次,真心很麻烦! 通过简单的设置,就可以解决这一问题! 编辑仓库目录中本地的”.git/config”文件 ...
- 3 Longest Substring Without Repeating Characters
public int lengthOfLongestSubstring(String s) { long length = s.length(); String tmp = ""; ...
- h5 js 图片预览并判断 ajax上传
//建立一個可存取到該file的url function getObjectURL(file) { var url = null; if (window.createObjectURL != unde ...
- Centos实现回收站机制
作为一个运维人员,在服务器上删除文件时为了方便经常会直接使用rm *.txt这类通配符,甚至为了省事加-rf参数,如果是确定的话还好,要是在删除的时候一个不留神,那事可就大了. 俗话说常在河边站哪有不 ...
- mount: unknown filesystem type 'ntfs'
mount: unknown filesystem type 'ntfs' 问题描述 # mount –t ntfs /dev/sdc1 /mnt/usb2 mount: unknown filesy ...
- Java hashCode() 和 equals()的若干问题
原文:http://www.cnblogs.com/skywang12345/p/3324958.html 本章的内容主要解决下面几个问题: 1 equals() 的作用是什么? 2 equals() ...
- 【转】Nginx服务器详细配置含注释
#使用的用户和组 user www www; #指定工作衍生进程数(一般等于CPU的总核数或总核数的两倍) worker_processes 8; #指定错误日志存放的路径,错误日志的记录级别可为de ...
- (Python )格式化输出、文件操作、json
本节学习Python的格式化输出,文件操作以及json的简单用法 1.格式化输出 将非字符串类型转换成字符串,可以使用函数:str() 或者repr() ,(这两个函数的区别目前我还没搞懂,求解答) ...