<!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">
<table border="" cellspacing="" cellpadding="">
<tr ng-repeat="p in persons">
<td>{{p.name}}</td>
<td>{{p.age}}</td>
<td><input type="button" value="修改" ng-click="xiugai($index)"/></td>
</tr>
</table>
<div class="xia" ng-show="a">
名字:<input type="text" ng-model="x_name"/><br>
年龄:<input type="text" ng-model="x_age"/><br>
<input type="button" value="OK" ng-click="ok(index)" ng-model="i"/>
</div>
<script type="text/javascript">
var mo = angular.module("myApp",[]);
mo.controller("myCtrl",function($scope){
//初始化数组
$scope.persons = [{"name":"张三","age":20},{"name":"李四","age":19}];
$scope.xiugai = function($index){
//页面显示
$scope.a = true;
//回显
var name1 = $scope.persons[$index].name;
var age1 = $scope.persons[$index].age;
$scope.x_name = name1;
$scope.x_age = age1;
$scope.i = $index;
}
//点击OK按钮,实现修改
$scope.ok = function(){
var newPerson = {"name":$scope.x_name,"age":$scope.x_age};
$scope.persons.splice($scope.i,1,newPerson);
}
})
</script>
</body>
</html>
修改代码
最新推荐文章于 2021-07-20 14:38:24 发布