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 stackoverflow.com/questions/41425879/… — ricky
– ricky, Commented Jan 4, 2017 at 6:30

Satpal · Accepted Answer · 2017-01-04 06:55:22Z

2

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>

edited Jan 4, 2017 at 6:55

answered Jan 4, 2017 at 6:34

Satpal

134k13 gold badges168 silver badges171 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

ricky Over a year ago

your code snippet in not correct. service does not suppose to return any explicit object in angular

ricky · Accepted Answer · 2017-01-04 06:45:19Z

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.

Collectives™ on Stack Overflow

Angular Services return function error

2 Answers 2

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related