CODEWITHSUNDEEP
javascriptangularjsjson
Codelife
Codelife

Reputation: 185

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": "[email protected]"
      }
    ],
    "message": "This is good day",
    "isclicked": false
  },
  "2": {
    "venture": "BBC Informatics",
    "member": [
      {
        "name": "xyz",
        "email": "[email protected]"
      }
    ],
    "message": "This is bad day",
    "isclicked": true
  }
}

Upvotes: 0

Views: 905

Answers (2)

charlietfl
charlietfl

Reputation: 171669

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

Upvotes: 1

Jeffrey A. Gochin
Jeffrey A. Gochin

Reputation: 964

Assuming you have your data is on the scope, you'd use the JavaScript delete function to remove an item from the array.

So...

delete $scope.data["1"]

Angular's digest should update anything watching that scope property automatically.

Upvotes: 1

Related Questions