排序删除

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src="js/angular.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body ng-app="myapp" ng-controller="myCtrl">
<div ng-show="person.length">
<input type="text" placeholder="姓名"ng-model="name" />
<input type="text" placeholder="部门" ng-model="part" />
<select ng-change="paixu(value)" ng-model="value" ng-init="value='年龄正序'">
<option>年龄正序</option>
<option>年龄倒序</option>
<option>薪资正序</option>
<option>薪资倒序</option>
<option>生日正序</option>
<option>生日倒序</option>
</select>
<input type="button" name="" id="" value="批量删除"ng-click="deleAll()" />
<table border="1px" cellpadding="0px" cellspacing="0px">
<tr ng-repeat="p in person|filter:name|filter:part|orderBy:type" >
<td>
<input type="checkbox" />
</td>
<td>{{p.name}}</td>
<td>{{p.age}}</td>
<td>{{p.sex}}</td>
<td>{{p.salary}}</td>
<td>{{p.birth}}</td>
<td>{{p.part}}</td>
<td><input type="button" value="删除" ng-click="dele()"/></td>

</tr>
</table>
</div>
<span ng-hide="person.length">无数据</span>
<script type="text/javascript">
var app=angular.module("myapp",[]);
app.controller("myCtrl",function($scope,$http){
$http.get("demo.json").then(function(req){
var d=req.data;
$scope.person=d;

});
$scope.type="age";
$scope.paixu=function(v){
switch(v){
case "年龄正序":
$scope.type="age";
break;
case "年龄倒序":
$scope.type="-age";
break;
case "薪资正序":
$scope.type="salary";
break;
case "薪资倒序":
$scope.type="-salary";
break;
case "生日正序":
$scope.type="-salary";
break;
case "生日倒序":
$scope.type="-salary";
break;
}
}
$scope.dele=function($index){
var b=confirm("是否删除");
if (b) {
$scope.person.slice($index,1);
}
}
})


</script>



</body>
</html>

posted @ 2018-06-25 08:03  失落的城市  阅读(105)  评论(0编辑  收藏  举报