EffGee EffGee - 6 months ago 33
AngularJS Question

Angular Service insie module not found

I am trying to modularize my angular application and put some services inside a Module.
Everytime i try to reference my Service there is an error saying:
Unknown provider: UtilsProvider <- Utils <- benutzerUebersichtController

My code is:



var utils = angular.module('Utils',[]);
utils.service('UtilsService', function () {
this.CurrentUser = 'Hello World';
});


var verwaltungApp = angular.module('verwaltungApp', ['Utils'])


verwaltungApp.controller('benutzerUebersichtController', ['$scope', '$http', '$filter','Utils', benutzerUebersichtController]);

function benutzerUebersichtController($scope, $http, UtilsService) {
$scope.Test = UtilsService.CurrentUser;
};

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="verwaltungApp">
<div ng-controller="benutzerUebersichtController">
<span>{{Test}}</span>
</div>
</div>




Zee Zee
Answer

You din't inject the service in your controller properly.

This :

verwaltungApp.controller('benutzerUebersichtController', ['$scope', '$http', '$filter','Utils', benutzerUebersichtController]); 
function benutzerUebersichtController($scope, $http, UtilsService) {
    $scope.Test = UtilsService.CurrentUser;
};

should be:

verwaltungApp.controller('benutzerUebersichtController', ['$scope', '$http', '$filter','UtilsService', benutzerUebersichtController]);

function benutzerUebersichtController($scope, $http,$filter, UtilsService) {
    $scope.Test = UtilsService.CurrentUser;
};