Angular Services return function error

Question

In the following two examples I am using 2 different structures for service return. While first I am returning the function in braces, in second I am returning function by function name. According to me both should work fine.

While Case 1 works, Case 2 fails. Can someone explain why?

Case 1

// module declaration
var app = angular.module('myApp', []);

// controllers declaration
app.controller('myCtrl', function($scope, baseService ){
$scope.name = "Peter";
var a = baseService.helloFunction()
 console.log(a);
});

// services declaration
app.service('baseService', function($http){
return{
 // For Rating Chart 
 helloFunction: function() {
  return "Hello";
 }

}

});

<body ng-app="myApp" ng-controller="myCtrl"> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.5/angular.min.js"></script>
</body>

Case 2:

//module declaration
var app = angular.module('myApp', []);

//controllers declaration
app.controller('myCtrl', function($scope, baseService ){
$scope.name = "Peter";
var a = baseService.helloFunction()
 console.log(a);
});

// services declaration
app.service('baseService', function($http){

// For Rating Chart 
helloFunction: function() {
 return "Hello";
}

return helloFunction();

});

<body ng-app="myApp" ng-controller="myCtrl"> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.5/angular.min.js"></script>
</body>

In this, while Case 1 works fine, Case 2 fails! While in both cases in service structure I am returnign inner function in outer function. Why doesn't case 2 works?

posibble duplicate of this http://stackoverflow.com/questions/41425879/http-post-callback-not-working-angular-factory/41426270#41426270 — ricky, Jan 04 '17 at 06:30
But, as javascript I just have to return inner function. I am doing same thing in both cases. The answer cannot explain the error or why is it coming? — Deadpool, Jan 04 '17 at 06:33

Satpal · Accepted Answer · 2017-01-04T06:55:22.297

You case 2 has syntactical errors and You are returning the output of the function helloFunction. As you are invoking it.

Since string does't have helloFunction() function it throws the error.

Here the snippet.

//module declaration
var app = angular.module('myApp', []);

//controllers declaration
app.controller('myCtrl', function($scope, baseService) {
  $scope.name = "Peter";
  var a = baseService.helloFunction()
  console.log(a);
});

// services declaration
app.service('baseService', function($http) {
  // For Rating Chart 
  this.helloFunction = function() {
    return "Hello";
  }
});

//Or, Create factory
app.fatory('baseService2', function($http) {
  // For Rating Chart 
  var helloFunction = function() {
    return "Hello";
  }
  return {
    helloFunction: helloFunction
  };
});

<body ng-app="myApp" ng-controller="myCtrl">
  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.5/angular.min.js"></script>
</body>

your code snippet in not correct. service does not suppose to return any explicit object in angular — ricky, Jan 04 '17 at 06:49

ricky · Answer 2 · 2017-01-04T06:45:19.673

You service code should look like this

//module declaration
var app = angular.module('myApp', []);

//controllers declaration
app.controller('myCtrl', function($scope, baseService ){
$scope.name = "Peter";
var a = baseService.helloFunction()
 console.log(a);
});

// services declaration
app.service('baseService', function($http){

// For Rating Chart 
this.helloFunction: function() {
 return "Hello";
}
  
});

Or the way you are using is suppose to be factory

//module declaration
var app = angular.module('myApp', []);

//controllers declaration
app.controller('myCtrl', function($scope, baseService ){
$scope.name = "Peter";
var a = baseService.helloFunction()
 console.log(a);
});

// services declaration
app.factory('baseService', function($http){

return { 
helloFunction: function() {
 return "Hello";
}

  }


});

Services are like prototype function no need to return explicitly and in case of factory you return the object.

Angular Services return function error

2 Answers2