13

I've started learning Angular JS and I'm having a problem with injecting a service into a controller. I'm trying to put the ThreadFactory service into ThreadController, but I'm getting an undefined error when calling it. Any advice would be great. The error I'm getting is:

Unknown provider: $scopeProvider <- $scope <- ThreadService

app.js

angular.module('threadsApp', ['ngRoute']);
angular.module('threadsApp')
    .config(function ($routeProvider, $locationProvider) {
        $routeProvider
            .when('/', {
                templateUrl: 'views/index.html',
            })
            .when('/selected/:topicName', {
                templateUrl: 'views/threads.html',
                controller: 'ThreadController',
            })
            .otherwise({
                redirectTo: "/"
            });
            $locationProvider.html5Mode(true);
    });

ThreadController.js

angular.module('threadsApp').controller("ThreadController",
    ["$scope", "$route", "$routeParams", "ThreadService", function ($scope, $route, $routeParams, ThreadService) {
    $scope.test = "Hello!";
    $scope.test2 = ThreadService.get();
}]);

ThreadService.js

angular.module('threadsApp').service("ThreadService", ["$scope", function ($scope) {
    return {
        get: function() {
            return "Hello";
        }
    }
}]);

Order of Imports

    <script src="bower_components/jquery/dist/jquery.js"></script>
    <script src="bower_components/angular/angular.js"></script>
    <script src="bower_components/angular-route/angular-route.js"></script>
    <script src="bower_components/bootstrap/dist/js/bootstrap.js"></script>
    <script src="components/app.js"></script>
    <script src="components/bodyController.js"></script>
    <script src="components/TopicController.js"></script>
    <script src="components/ThreadService.js"></script>
    <script src="components/ThreadController.js"></script>
Ben Harris
  • 1,734
  • 3
  • 15
  • 24

1 Answers1

25

You can't actually inject $scope into your ThreadService the way you're trying to. $scope isn't a typical service when you inject it into a controller. If you remove the $scope injection from Threadservice.js, I would bet the error will go away.

In the interest of not being redundant, a fuller explanation can be found here:

Injecting $scope into an angular service function()

Community
  • 1
  • 1
jdotjdot
  • 16,134
  • 13
  • 66
  • 118