0

I have created a controller and a service in AngularJS. I am trying to pull some json data from a URL and display it on the web page. Following are the main parts of the code.

Controller

app.controller('MainController',function ($scope,myservice) {

         $scope.getsomedata = function () {
         $scope.somedata = myservice.getdata();
     }
});

Service

app.factory('myservice', ['$http', function ($http) {
    var serviceObj = {};

    serviceObj.get = $http.get('https://s3.amazonaws.com/codecademy-content/courses/ltp4/forecast-api/forecast.json').then(function (resp) {
        return resp.data;
    });
    serviceObj.getdata = function () {
        return serviceObj.get;
    };
    return serviceObj;
}])

mywebpage.html

 <body ng-app="myApp">
<div class="wrapper" ng-controller="MainController">
<a ng-href='#here' ng-click='getsomedata()'>click me</a>
{{somedata}}
</div>

When I execute the html page, I see {}. I cannot see any data. I want to understand what am I doing wrong here.

(I have not put the code for MyApp here).

KurioZ7
  • 6,028
  • 13
  • 46
  • 65
  • 1
    Possible duplicate of [How do I return the response from an asynchronous call?](http://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-call) – deceze Feb 23 '16 at 14:43
  • For one, `getdata()` returns a function, not any data. Secondarily, even if you fixed that, the call is still ***asynchronous***. See the duplicate for that. – deceze Feb 23 '16 at 14:44

0 Answers0