angularjs - $http.get(url) not returning data -

i building service in angular , injecting service in controller. trying fetch data json file , using $http. data not getting returned , undefined.

i updating code per suggestion @phil

service.js

;(function(app) {     app.factory('authservice', ['$log', '$http','$location', function($log, $http,$location) {          var url = 'js/user.json';         var authservice= {};         var userexist=null;          authservice.authenticate = function(userid) {             var userobj = $http.get(url).success(function (data) {                 userexist = data                 console.log(data);                 return userexist;                 $log.info("loaded users");             })             .error(function (error) {                 $log.info(error);                 $log.info("no user exists");                 return error;             })              return userobj;         }         return authservice;       }]); })(angular.module('userapp')); 

controller.js

;(function(app) { app.controller('controller', ['$scope', '$log','$location','authservice', function($scope,$log,$location,authservice) {      $scope.data={};     $scope.getusers = function()     {       userid = "123";       $scope.data = authservice.authenticate(userid);       console.log($scope.data);       return $scope.data ;   }  }])  }(angular.module('userapp'))); 

index.html

 <div class="main" ng-controller="controller">          <input type="button" name="btngetusers" ng-click="getusers()"></input>      </div>      <script src ="js/app.js"> </script>     <script src ="js/controller/controller.js"> </script>     <script src ="js/services/service.js"> </script> 

user.json have placed json file under js directory.

[     {         "userid": "1",         "fname": "hice",         "lastname": "harry"     },     {         "userid": "2",         "fname": "andrew",         "lastname": "ads"     } ] 

the data getting returned undefined. missing here?

updated code

i updating code per suggestion @skubsi

service.js

    ;(function(app) {     app.factory('authservice', ['$log', '$http','$location', function($log, $http,$location) {          var url = 'js/user.json';         var authservice = {};         var userexist=null;          authservice.authenticate = function(userid,success,error) {             $http.get(url).success(function(data){                 success(data);             })             .error(error);          };         return authservice;       }]); })(angular.module('userapp')); 

controller.js

;(function(app) { app.controller('maincontroller', ['$scope', '$log','$location','authservice', function($scope,$log,$location,authservice) {     var self = this;     this.data = null;      this.getusers = function(){          function success(response){             self.data = response;         }          function error(){             console.log("error");         }         authservice.authenticate(1,success,error);     }   }])  }(angular.module('userapp'))); 

index.html

<div class="main" ng-controller="maincontroller main">              {{main.data}}             <input type="button" name="btngetusers" value ="get user" ng-click="main.getusers()"></input>          </div>      <script src ="js/app.js"> </script>     <script src ="js/controller/maincontroller.js"> </script>     <script src ="js/services/authenticate.js"> </script> 

first things first: json invalid, can verify entering json supplied in jsonlint.

parse error on line 2: [    {        userid: 123,        --------------^ expecting 'string', '}' 

secondly pass unknown service controller:

authenservice 

then should realize promise code run asynchronously, meaning that:

  userid = "123";   $scope.data = authservice.authenticate(userid);   console.log($scope.data);   return $scope.data ; 

will not run synchronously. console.log($scope.data); executed long before authenticate method done. need find way make controller handle accordingly whilst keeping concerns separated. (and not falling deferred-anti-pattern).

you example add additional parameters authenticate function, enable function call original caller.

 authservice.authenticate = function(userid, success, error) { //success , error functions     $http.get(url).success(function(data) {         //separation of concerns:         //execute logic.. set flags, filter w/e belongs authentication process.         success(data);       })       .error(error); //no processing required   }; 

so in controller left calling authservice , providing way set data:

  this.getusers = function() {     //this enable set response controllers data model.     function success(response) {       self.data = response;       window.alert(response);     }      function error() {       window.alert('shite happened');     }      authservice.authenticate(1, success, error);   }; 

note have used controlleras syntax instead of $scope. prove mechanism works created plunker investigate.