Jérémie Chazelle Jérémie Chazelle - 7 months ago 27
Javascript Question

Inject service in factory error : [$injector:unpr] Unknown provider: $scopeProvider <- $scope <- ProjectService <- Project

I would like inject my service in my factory to use my factory in my controller :

Controller

app.home.controller('HomeController', ['$scope', '$http', 'Project', function ($scope, $http, Project) {

var project = new Project();

$scope.refresh = function(){
project.createTable();
};

$scope.refresh();

}]);


Model (factory)

app.project.factory('Project', function (ProjectService) {

var Project = function (properties) {
// Model
this.file = null;
this.name = null;
this.path = null;
this.is_active = null;

angular.extend(this, properties);
};

Project.prototype.setModel = function (obj) {
angular.extend(this, obj);
};

Project.prototype.createTable = function () {
console.log(this);
return ProjectService.ok();
};

return Project;

});


Service

app.project.service('ProjectService', ['$scope', '$http', function ($scope, $http) {

this.ok = function() {
return 'all';
};

}]);


But I have an error :


angular.min.js:13550 Error: [$injector:unpr] Unknown provider: $scopeProvider <- $scope <- ProjectService <- Project


I don't see my error..

I tried to rename model/service it's the same error

In my index.html :

<!--Project-->
<script src="js/modules/project/project.js"></script>
<script src="js/modules/project/model/project.model.js"></script>
<script src="js/modules/project/service/project.service.js"></script>

Answer

The problem is, you had injected $scope provider in ProjectService service.

You can not inject $scope provider in service, basically it can be available to inject in controller & directive link function only.

app.project.service('ProjectService', ['$http', function ($http) {
   var self = this;
    self.ok = function() {
      return 'all';  
    };
}]);