AngularJS, JSON, delete item
by Seetpal Singh
HTML
<div ng-app="plunker" ng-controller="MainCtrl">
<div>
<table width="100%">
<tr ng-repeat="task in tasks | limitTo: 5" ng-class="{special : $index%2}">
<td class=''>{{$index}}</td>
<td width="50%">{{task.Name}}</td>
<td width="50%">{{task.City}}</td>
</tr>
</table>
</div>
<br/>
<input ng-click='go()' type='button' class='fr' value="get Data" />
<input ng-click='delete()' type='button' class='fl' value="delete Data" />
</div>
CSS
.fr{
float:right
}
.fl{
float:left
}
.special td {
background-color: #ddd;
}
td{
padding: 4px; font-family:arial; font-size: 12px;
}
JavaScript
var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope,$http) {
$scope.delete = function ask(){
var numb = prompt("Please enter index value", "numbers only please");
if (numb != null && numb >= 0 ) {
$scope.tasks.splice(numb , 1);
}
else if(numb === null){
return false;
}
else{
ask();
}
}
$scope.go = function() {
$http.get('http://www.w3schools.com/website/Customers_JSON.php')
.success(function(data){
$scope.tasks = data;
$scope.limitNumber = 5;
});
}
});