Codelife Codelife - 5 months ago 24
Javascript Question

Delete item using ANgularJS

I have a JSON file which contains data. I can print the data using ANgularJS. It will show in row with a checkbox and there is a Delete button. I want to delete the data from display and as well as from JSON file. Delete process would be like, Click on the checkbox which you want to Delete > Click on the Delete button. This is my plnkr link :-

http://plnkr.co/edit/A07XJk1RQNmhSnLFqLxH?p=preview

api.json is the JSON file.

This is the JSON file look like :-

{
"1": {
"venture": "XYZ Informatics",
"member": [
{
"name": "abcd",
"email": "abcd@gmail.com"
}
],
"message": "This is good day",
"isclicked": false
},
"2": {
"venture": "BBC Informatics",
"member": [
{
"name": "xyz",
"email": "xyz@gmail.com"
}
],
"message": "This is bad day",
"isclicked": true
}
}

Answer

Add ng-model to checkbox....then iterate data and use delete if it is checked

  $scope.delete = function() {
     angular.forEach($scope.datas, function(val, key) {
       if (val.isclicked) {
         delete $scope.datas[key];
       }
     })
   }

View

<form ng-repeat="data in datas">            
    <input type="checkbox" ng-model="data.isclicked">{{ data.venture }}          
</form>
<button ng-click="delete()">Delete</button>

DEMO

Comments