json value not fetching from localhost to angularjs frontend

Question

This my javascript part i am not able to get any response from $http.get can anyone suggest a solution

<script>
var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
    $http.get("http://localhost:3000/load")
    .success(function(response) {$scope.names = response;});
});
</script>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="customersCtrl"> 

<ul>
  <li ng-repeat="data in names">
    {{ data.name + ', ' + data.age }}
  </li>
</ul>

</div>

Do you know that http://localhost:3000/load is returning a value? — Capn Sparrow, Sep 14 '15 at 10:19
Why you are using http://localhost ?? use your application path /webapp path from where you want to fetch data — Nishith Kant Chaturvedi, Sep 14 '15 at 10:20
@NishithChaturvedi I am using nodejs to fetch data from mysql database,and its passed as json to http://localhost:3000/load — tinku, Sep 14 '15 at 11:18
@Vineet actually i am getting a console error XMLHttpRequest cannot load http://localhost:3000/load. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access. — tinku, Sep 14 '15 at 11:39

score 0 · Answer 1 · answered Sep 14 '15 at 10:37

0

From AngularJS documentation https://docs.angularjs.org/api/ng/service/$http

// Simple GET request example :
$http.get('/someUrl').
  then(function(response) {
    // this callback will be called asynchronously
    // when the response is available
  }, function(response) {
    // called asynchronously if an error occurs
    // or server returns response with an error status.
  });

No localhost:3000, just use '/load'.

No '.success', use '.then'

answered Sep 14 '15 at 10:37

Dmitri Algazin

3,332
27
30

@Dmithri I tried the above code its still not working – tinku Sep 14 '15 at 11:14
thanks everyone for the help i got it working this was a CORS issue – tinku Sep 14 '15 at 12:11

score 0 · Answer 2 · answered Sep 14 '15 at 11:21

Try this

 var Response = $http.get( $window.location.pathname + your url); //put your url here
        Response.success( function ( data ) {

        $scope.Names = data;
        } );
         Response.error( function ( data ) {
            $scope.error = data;
    } );

score 0 · Answer 3 · answered Sep 14 '15 at 11:59

0

Your angular code has to change like @Dmitri Algazin has suggested. Check below code and the JS Fiddle

$http.get("http://localhost:3000/load")
.then(function(response) {$scope.names = response.data;});

JSfiddle

answered Sep 14 '15 at 11:59

Pasan Ratnayake

495
4
10

json value not fetching from localhost to angularjs frontend

3 Answers3