-2

I am trying to get HTTP response from my Django local server which returns a JSON response.

JSON response:

[{"fields": {"DOB": "2015-05-08", "image": "media/jainsubh_1394437734_6.png", "text_file": "my_Txt_Files/JN2i0oq.png", "usr_name": "ankitmishra", "email": "anbishamar@gmail.com"}, "model": "my_fr_app.new_user_reg", "pk": 15}]

Angular code is:

<!DOCTYPE html>
<html>
<script src= "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<body>

<div ng-app="myApp" ng-controller="customersCtrl"> 

<ul>
  <li ng-repeat="x in items">
    {{ x.usr_name  }}
  </li>
</ul>

</div>

<script>
var app = angular.module('myApp', []);
app.controller('customersCtrl', ['$http',function($http) {
  $http.get("http://127.0.0.1:8000/members")
  .success(function (response) {
    this.items = response.data.fields;
  }]);
});
</script>

</body>
</html>

I don't know why its success callback does not executes !! though the server returns response code 200 & 304 means that get request is being executed .

Mr Smith
  • 3,318
  • 9
  • 47
  • 85
Ankit Mishra
  • 1
  • 4
  • What do you mean by 'success callback does not execute'? what happens? – 0xc0de May 15 '15 at 14:06
  • *"I don't know why its success callback does not executes"* How are you coming to that conclusion? Did you add a console.log to it? did you check the network tab for CORS errors? – Kevin B May 15 '15 at 14:18

1 Answers1

-1

Just to post an alternative, for fun, you could also do this using ControllerAs functionality in Angular. 

<div ng-app="myApp" ng-controller="customersCtrl as vm"> 

<ul>
  <li ng-repeat="x in vm.items">
    {{ x.usr_name  }}
  </li>
</ul>

</div>

<script>
    var app = angular.module('myApp', []);
    app.controller('customersCtrl', ['$http', '$scope',function($http, $scope) {
        var vm = this;  // this is to help you with closure issues.  Using the ControllerAs functionality, there is no need to go into $scope at all.
        $http.get("http://127.0.0.1:8000/members")
            .success(function (response) {
                vm.items = response.data.fields;
        });
    }]);
</script>

http://toddmotto.com/digging-into-angulars-controller-as-syntax/

KnowHowSolutions
  • 680
  • 3
  • 10