<!DOCTYPE html>
<html lang="en" ng-app="app">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="../js/angular.min.js"></script>
<style>
body {
font-size: 12px;
}
li {
list-style: none;
margin: 5px 0;
}
ul {
width: 500px;
margin: 0;
padding: 0;
}
span {
display: inline-block;
width: 80px;
text-align: center;
}
.bold {
font-weight: bold;
}
.odd {
color: #0026ff;
}
.even {
color: #ff0000;
}
.focus {
color: #ddcdc2;
}
</style>
</head>
<body>
<div ng-controller="ctrl1">
<!--<span>{{8.88 | currency}}</span>-->
<div>
<input type="text" ng-model="key" placeholder="请输入关键字">
</div>
<ul>
<li ng-class="'bold'">
<span>id</span>
<span ng-click="title='name';desc=!desc">姓名</span>
<span ng-click="title='sex';desc=!desc">性别</span>
<span ng-click="title='age';desc=!desc">年龄</span>
<span ng-click="title='score';desc=!desc">分数</span>
</li>
<!--<li ng-repeat="stu in data | orderBy: '-score'| limitTo:3" ng-class-odd="'odd'" ng-class-even="'even'"-->
<!--ng-class="{'focus':$index==focus}" ng-click="click($index)">-->
<!--<li ng-repeat="stu in data | filter:findScore" ng-class-odd="'odd'" ng-class-even="'even'"-->
<!--ng-class="{'focus':$index==focus}" ng-click="click($index)">-->
<!--<li ng-repeat="stu in data | young:0" ng-class-odd="'odd'" ng-class-even="'even'"-->
<!--ng-class="{'focus':$index==focus}" ng-click="click($index)">-->
<li ng-repeat="stu in data | filter:{name:key}| orderBy:title:desc" ng-class-odd="'odd'" ng-class-even="'even'"
ng-class="{'focus':$index==focus}" ng-click="click($index)">
<span>{{$index+1}}</span>
<span>{{stu.name}}</span>
<span>{{stu.sex}}</span>
<span>{{stu.age}}</span>
<span>{{stu.score}}</span>
</li>
</ul>
</div>
</body>
<script>
var exg = angular.module('app', []);
exg.controller('ctrl1', function ($scope) {
$scope.data = [
{name: '小明', sex: '男', age: '20', score: '78'},
{name: '小云', sex: '男', age: '21', score: '85'},
{name: '小蓝', sex: '女', age: '19', score: '76'},
{name: '小维', sex: '女', age: '18', score: '92'},
{name: '小达', sex: '男', age: '20', score: '80'}
];
$scope.click = function (i) {
$scope.focus = i;
};
$scope.findScore = function (e) {
return e.score > 82 && e.score < 95;
};
$scope.title='name';
$scope.desc = 1;
$scope.key = "";
});
exg.filter('young', function () {
return function (e, type) {
var _out = [];
var _sex = type ? "男" : "女";
for (var i = 0; i < e.length; i++) {
if (e[i].age < 20 && e[i].age > 18 && e[i].sex == _sex) {
_out.push(e[i]);
}
}
return _out;
}
})
</script>
</html>
