title: Angularjs - Update JSON
body: <p>I'm very new to Angularjs and am having issues figuring out how to update a $scope element I created from JSON. Basically I have a service that contains the function which grabs the JSON:</p>
  
  <pre><code>app.service('JSONService', function($http){         
      return{
          getJSON: function(){
              return $http.get('posts.json')
                  .then(function(response){
                      return response.data;
                  });
          }
      };
   });
  </code></pre>
  
  <p>I then have a Controller that contains a function that gets the JSON data on button click and puts it in $scope.data and a second function that I would like to use to update $scope.data:</p>
  
  <pre><code>app.controller('PostController', function PostController($scope, JSONService){
      $scope.data;
  
      $scope.getJSON = function(){            
          $scope.data = JSONService.getJSON();
      };
      $scope.addPost = function(){
          // Add to $scope.data
      };
  });
  </code></pre>
  
  <p>Currently, I successfully grab the JSON data and am able to use it to populate aspects of my view, but I am stuck on how to proceed with updating $scope.data so that:</p>
  
  <ol>
  <li>It actually updates</li>
  <li>The update is reflected in my view</li>
  </ol>
  
  <p>I have tried $broadcast, $scope.data.push, $scope.data.posts.push. These have either flat out not worked or given errors. I'm sure it might be a simple answer, but I feel I may be inexperienced with Angularjs and JSON to pick up on it. Thanks in advance.</p>