我想在单击删除按钮时显示带有弹出窗口的 ID。但是当我点击删除按钮时,它不起作用。当我在检查元素中检查控制台时,他们说 listData 不是未定义的。有人帮我吗?我是 angularjs 的新手 查看:
<!DOCTYPE html>
<html>
<head>
<title>CRUD</title>
<style type="text/css">
.table{
border-collapse: collapse;
}
tr,td,th{
border: 1x solid #000;
padding: 5px;
}
td{
width: 300px
}
</style>
</head>
<body ng-App="myAPP">
<div ng-controller="MainController">
<table class="table">
<tr>
<th>ID</th>
<th>Nama</th>
<th>Alamat</th>
<th>Action</th>
</tr>
<tr ng-repeat="x in listData">
<td>{{x.id}}</td>
<td>{{x.nama}}</td>
<td>{{x.alamat}}</td>
<td>
<a href="#" ng-click="del(x.id)">Delete</a>
<a href="#" ng-click="update(x.id)">Edit</a>
</td>
</tr>
</table>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.6/angular.min.js"></script>
<script src="js/app.js"></script>
<script src="controller/MainController.js"></script>
</body>
</html>
Controller :
app.controller('MainController',['$scope',function($scope){
$scope.listData = [
{
'id' : 01,
'nama' : 'Faizah Pratiwi',
'alamat' : 'Malang'
},
{
'id' : 02,
'nama' : 'Anastasya Putri',
'alamat' : 'Jember'
},
{
'id' : 03,
'nama' : 'Sharon Natalia',
'alamat' : 'Tulungagung'
},
{
'id' : 04,
'nama' : 'Faizah Pratiwi',
'alamat' : 'Malang'
},
];
$scope.del = function(id){
var index = getSelectedIndex(id);
alert(index);
$scope.listData.slice(index,1);
};
function getSelectedIndex(id){
for (var i = 0; i < listData.length; i++) {
if($scope.listData[i].id==id)
return i;
return -1;
}
}
}]);
最佳答案
它说未定义,因为它应该是 $scope.listData
,
function getSelectedIndex(id){
for (var i = 0; i < $scope.listData.length; i++) {
if($scope.listData[i].id==id)
return i;
}
return -1;
}
也不是切片,是拼接
$scope.listData.splice(index, 1);
您可以使用这段代码直接从数组中删除索引,而不是这样做,
$scope.del = function(index) {
alert(index);
$scope.listData.splice(index, 1);
};
关于javascript - 如何用angularjs显示id,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40012102/