<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta http-equiv="X-UA-Compatible"content="IE=edge" />
<meta name="viewport"content="width=device-width,initial-scale=1" />
<title></title>
<meta charset="utf-8" />
<link rel="stylesheet"href="bootstrap-3.3.6-dist/css/bootstrap.min.css" />
<style>
table td {
border:solid 1px grey;
border-collapse:collapse;
padding:10px;

}
table tr:nth-child(odd) {
background-color:#f1f1f1;
}
table tr:nth-child(even) {
background-color:#ffffff;
}
</style>
</head>
<body>
<div class="container"style="padding:50px">
<div data-ng-app="myApp"data-ng-controller="myCtrl">
<table>
<tr data-ng-repeat="x in names | orderBy:'liaohao'">
<td>{{x.liaohao}}</td><td>{{x.xinghao}}</td>
</tr>
</table>
</div>
</div>
<script src="jQuery/jquery-2.1.4.min.js"></script>
<script src="bootstrap-3.3.6-dist/js/bootstrap.min.js"></script>
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
<script>
angular.module("myApp", []).controller("myCtrl", function ($scope, $http) { $http.get("json/json.json").success(function (response) { $scope.names=response.records}) })
</script>
</body>
</html>

AngularJS表格排序的更多相关文章

  1. 【09】AngularJS 表格

    AngularJS 表格 ng-repeat 指令可以完美的显示表格. 在表格中显示数据 使用 angular 显示表格是非常简单的: <div ng-app="myApp" ...

  2. JS实现表格排序

    今天有点闲,写个小东西,使用JS实现点击表格标题栏实现自动排序功能,嘻嘻... 一.JS代码,文件名为code.js如下: (function($){ //插件 $.extend($,{ //命名空间 ...

  3. jQuery 表格排序插件 Tablesorter 使用

    jQuery 表格排序插件 Tablesorter 使用方式如下: 1.引入头文件(注意一定要把jQuery放在前面): <script src="lib/jquery-1.8.3.m ...

  4. JS表格排序

    var employees = [] employees[0] = { name: "George", age: 32, retiredate: "March 12, 2 ...

  5. JavaScript写一个表格排序类

    依稀记得那是上个星期六的下午,我参加了网易暑期实习生招聘笔试.考得相当糟糕,编程题3个题通过了2个,简答题没做对,选择题貌似是20个题猜了6-7个,99%是挂了,唉唉唉!生活不只眼前的苟且,学习的脚步 ...

  6. 案例学习总结：原生JS实现表格排序

    最近在学习js的表格排序,没想到看不起眼的表格排序实际上却暗含了众多JS知识点.在这里记录一下此次学习过程.希望对大家也有所帮助. 完整的表格排序涉及了下列这些知识点: call方法使用 sort方法 ...

  7. ajax json 表格排序，分页，自己定义每页数量

    ajax json 表格排序.分页,自己定义每页数量  点击表头能够排序.依照升序或者降序,另外支持多列排序 设置每页数量 演示   XML/HTML Code <table id='examp ...

  8. javascript 表格排序和表头浮动效果(扩展SortTable)

    前段时间一个项目有大量页面用到表格排序和表头浮动的效果,在网上找了几个表格排序的js代码,最后选择了 Stuart Langridge的SortTable,在SortTable基础上做了些扩展,加上了 ...

  9. jQuery html表格排序插件：tablesorter

    ablesort是一款很好用的jQuery表格排序插件. 支持多种数据类型排序,会自动识别表格内容数据类型,使用也非常方便. 使用jQuery tablesort实现html表格方法: 1. 下载jQ ...

随机推荐

  1. CSS 专业的技巧

    目录 专业的技巧 支持情况 贡献准则   专业的技巧 使用CSS复位 继承 box-sizing 使用 :not() 选择器来决定表单是否显示边框 为 body 元素添加行高 垂直居中任何元素 逗号分 ...

  2. Linux防火墙/iptables使用

    iptables是linux下的防火墙组件服务,这两天一直使用,总结一下使用方法: 1.检查iptables是否安装 rpm -qa|grep iptables 如果没有安装该组件,可以通过yum i ...

  3. spring mvc 外键允许Null

    spring mvc 定义模型外键时允许为Null 新手记录,习惯定义模型时将外键的数据类型为long,基本类型. 这样生成的外键是不允许为Null,但是可以通过设置字段的Column注解,使之允许为 ...

  4. SpringMVC:系统认识一下maven

    网上看了很多springMVC helloworld的教程,非常不满意:首先,maven构建的就很少,再者,绝大部分都是断章取义,让人不明就里.其中有几篇讲的好的,我摘录了一些,自己试着构建了一下项目 ...

  5. Java集合篇一：ArrayList

    package com.test.collection; /** * 自定义ArrayList容器 * * 1.实现原理:底层封装数组 * * 2.查询 * LinkList 相较 ArrayList ...

  6. 【HTML&CSS】文本的基本处理

    其实在写这篇博客的时候已经学了很久,也写了不少代码,特别是很枯燥的看完整个html部分,因为不带有CSS写出来的东西干巴巴的一点也不好看. 直到展开CSS学习才开来补上博客,嗯,这是个好习惯. 这是运 ...

  7. spark编程python实例

    spark编程python实例 ValueError: Cannot run multiple SparkContexts at once; existing SparkContext(app=PyS ...

  8. 慧都启动“正版IDE联合超值推广计划

    越来越多的中国软件企业为盗版所害而蒙受巨大损失,正版化意识逐渐兴起.IDE(集成开发环境)是软件开发.编写代码必备工具,而正版IDE更具有运行更稳定.编码更安全.保障更加完善等特点,逾为中国软件行业企 ...

  9. Oracle 数据库异机恢复（归档模式）

    操作必须在服务器上进行(在192.168.12.71上执行) 0.按需要恢复的日期,把距恢复日期最近的全部备份和全部备份日期后的日志备份一同拷贝到需要恢复的机器上: 1.用RMAN登陆 C:\User ...

  10. Linux下的环境部署和项目发布

    1.查看系统版本 sudo uname --m i686 //表示是32位 x86_64 // 表示是64位 2.下载对应版本软件,jdk和Tomcat(切记注意版本) jdk: 下载地址:http: ...