<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">
<select ng-model="paixu">
<option value="">选择</option>
<option value="age">正序</option>
<option value="-age">倒序</option>
</select>
<input type="button" name="" id="" value="批量删除" ng-click="deleAll()" />
<table border="" cellspacing="" cellpadding="">
<tr ng-repeat="person in arr|orderBy:paixu">
<td><input type="checkbox" ng-model="person.state" /></td>
<td>{{person.name}}</td>
<td>{{person.age}}</td>
<td><input type="button" value="修改" ng-click="show($index,person.name,person.age)" /></td>
</tr>
</table>
<div class="div1" ng-show="isShow">
名字:<input type="text" ng-model="name12" /><br> 年龄:
<input type="text" ng-model="age12" />
<br>
<input type="button" name="" id="" value="提交" ng-click="save()" />
</div>
<script type="text/javascript">
var mo = angular.module("myApp", []);
mo.controller("myCtrl", function($scope, $http) {
$http.get("demo.json").then(function(res) {
$scope.arr = res.data;
});
$scope.deleAll = function() {
for(var i = $scope.arr.length - 1; i >= 0; i--) {
var p = $scope.arr[i];
console.log(p + "---")
if(p.state) {
$scope.arr.splice(i, 1);
}
}
}
var i_temp = 0;
//显示修改页面
$scope.show = function(index, name, age) {
i_temp = index;
$scope.isShow = true;
//将数据,填入修改页面
$scope.name12 = name;
$scope.age12 = age;
}
$scope.save = function() {
//取值
var name = $scope.name12;
var age = $scope.age12;
//创建对象
var obj = {
"name": name,
"age": age
};
//将原来的数据替换
$scope.arr.splice(i_temp, 1, obj);
}
});
</script>
</body>