<!DOCTYPE html>
<html ng-app="">
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
.border{border: 1px solid #ccc;width: 100px;height: 100px;float: left;}
</style>
<script src="../js/angular.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body ng-controller="con">
<input type="text" name="" id="" value="" />
<button ng-click="add()">添加</button>
<div ng-repeat="item in list track by $index">
<div class="border">{{item.age}}</div>
<div class="border">{{item.name}}</div>
<div ng-click="del(item.id)">删除</div>
</div>
</body>
<script type="text/javascript">
var con = function($scope){
$scope.list=[];
var id=0;
var age=0;
var sr ={age:'',name:'',id:id}
$scope.add = function(){
id++;
age++;
sr ={age:age,name:'',id:id}
$scope.list.push(sr);
console.log($scope.list)
}
$scope.del = function(dd){
$scope.list.forEach(function(item,key){
console.log(dd)
if(item.id==dd){
$scope.list.splice(key,1);
console.log(key)
}
})
}
}
</script>
</html>
ngRepeat实现动态添加删除
最新推荐文章于 2020-07-18 17:01:36 发布