How to view json data from angularjs http callback?

Question

I can see my json data in the console and I want to view it on html page after clickbutton function. From my understaning I can either do a promise ($q) or then with http o

Answer 1

$http itself is a promise, no need to create a new promise. Just return the $http.get wihoit the success written there and right the sucess fn in the controller itself. So your code will look like this:

app.factory('httpq', function($http) {
   return {
       get: function() {
          return $http.get.apply(null, arguments);
       }
   }
});

Your controller:

app.controller('myController',  function($scope, httpq) {
      httpq.get('http://localhost:8080/states').then(function(data) {
   $scope.returnedData = data;
 })

  $scope.clickButton = function() {
      $scope.returnedData;
  }

 });

Answer 2

use

$scope.returnedData=JSON.parse(data);

It will give you values in JSON format

Answer 3

Use Ajax call

Service:

var demoService = angular.module('demoService', [])
.service('myService',['$http', function($http) {

    this.getdata = function(entity){
        var promise = $http({
            method : 'POST',
            url : 'services/entity/add',
            data : entity,
            headers : {
                'Content-Type' : 'application/json'
            },
            cache : false
        }).then(function (response) {
            return response;
        });
        return promise;     
    };
}]);

Controller :

var demoService = angular.module('demoService', [])
.controller('myctr',['$scope','myService',function($scope,myService){
   myService.getdata().then(function(response){
            //Success

        },function(response){

            //Error         
        });

}]);

now you can see your json in controller success

Answer 4

I have not worked with promise. But your factory code seems to be ok.

In controller declare your object first.

If it's just object declare it as

$scope.returnedData = {};

If it's array, declare it as

$scope.returnedData = [];

The the object will not be undefined and changes will affect in HTML