Add, Remove & Update specific data In JSON in AngularJS
<p>I have pulled data from json file. Now its displayed over DOM.
On HTML Page, I have three option 1) Edit Data 2) Delete Particular Data &amp; 3) Add New Data.</p>

<p>How to perform this using AngularJS Code? i.e. on editing name, it should update my JSON object. On Deleting row, it should delete that row in JSON data. and also If I click on Add New, then entered data will be added to JSON.</p>

<p>My Code is as below.
Importing data through json file and displaying on DOM</p>

<pre><code>.controller('MainCtrl', function ($scope, $http) {
  $http.get('data/home.json').
    success(function(data, status, headers, config) {
      $scope.details = data;
    }).
    error(function(data, status, headers, config) {
      // log error
    });
});  
</code></pre>

<p>Output of this code is correct as below image.
<a href="https://i.stack.imgur.com/upYOh.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/upYOh.png" alt="enter image description here"></a>
JSON Object as below.</p>

<pre><code>    {   
   "status":"success",
   "adformat":[   
      {   
         "adformat_id":1,
         "name":"Format 1",
         "size":"300x250"
      },
      {   
         "adformat_id":2,
         "name":"Format 2",
         "size":"320x250"
      },
      {   
         "adformat_id":3,
         "name":"Format 3",
         "size":"320x480"
      }
   ]
}
</code></pre>