AngularJS - 오류 : $ injector : unpr 알 수없는 공급자 userService

AngularJS를 사용하여 백엔드에 대한 간단한 가입 및 로그인 양식을 만들려고합니다. 여기

내 파일 :

index.html을

<!DOCTYPE html> 
<html lang="en" ng-app="bookApp"> 
<head> 
<meta charset="utf-8"> 
<meta http-equiv="X-UA-Compatible" content="IE=edge"> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 

<title>Book Wishlist Application</title> 

<link href="bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"> 

<script src="bower_components/angular/angular.min.js"></script> 
<script src="bower_components/angular-route/angular-route.min.js"></script> 
<script src="bower_components/angular-local-storage/dist/angular-local-storage.min.js"></script> 
<script src="bower_components/restangular/dist/restangular.min.js"></script> 

<script src="js/app.js"></script> 
<script src="js/controllers.js"></script> 
<script src="js/services.js"></script> 


<style> 

    li { 
     padding-bottom: 8px; 
    } 

</style> 
</head> 

<body> 

<div class="container"> 
    <div class="row"> 
     <div class="col-md-12"> 
      <h1>Book Wishlist Application</h1> 
     </div> 
    </div> 

    <div ng-view></div> 
</div> 

<script src="bower_components/jquery/dist/jquery.min.js"></script> 
<script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script> 

</body> 
</html>

내 app.js

var app = angular.module('bookApp', [ 
    'ngRoute', 
    'bookController' 
]); 

app.config(['$routeProvider', function ($routeProvider) { 
    $routeProvider 
     .when('/login', { 
      templateUrl: 'partials/login.html', 
      controller: 'LoginController' 
     }) 
     .when('/signup', { 
      templateUrl: 'partials/signup.html', 
      controller: 'SignupController' 
     }) 
     .when('/', { 
      templateurl: 'partials/index.html', 
      controller: 'MainController' 
     }) 
     .otherwise({ 
      redirectTo: '/' 
     }); 
}]);

controllers.js

var bookController = angular.module('bookController', []); 

bookController.controller('LoginController', ['$scope', '$http', 'userService', function ($scope, $http, userService) { 
    $scope.login = function() { 
     userService.login(
      $scope.email, $scope.password, 
      function(response){ 
       $location.path('/'); 
      }, 
      function(response){ 
       alert('Something went wrong with the login process. Try again later!'); 
      } 
     ); 
    } 

    $scope.email = ''; 
    $scope.password = ''; 

    if(userService.checkIfLoggedIn()) 
     $location.path('/'); 
}]); 
bookController.controller('SignupController', ['$scope', '$http', 'userService', function ($scope, $http, userService) { 
    $scope.signup = function(){ 
     userService.signup(
      $scope.name, $scope.email, $scope.password, 
      function(response){ 
       alert('Account Creato'); 
       $location.path('/'); 
      }, 
      function(response){ 
       alert('Something went wrong with the signup process. Try again later.'); 
      } 
     ); 
    } 

    $scope.name = ''; 
    $scope.password = ''; 
    $scope.email = ''; 

    if(userService.checkIfLoggedIn()){ 
     $location.path('/'); 
    } 
}]); 
bookController.controller('MailController', ['$scope', '$http', function ($scope, $http) { 

}]);

services.js

,691 363,210

var bookServices = angular.module('bookServices', [ 
    'LocalStorageModule' 
]); 

bookServices.factory('userService', ['$http', 'localStorageService', function ($http, localStorageService) { 

    function checkIfLoggedIn() { 
     if (localStorageService.get('token')) { 
      return true; 
     } 
     return false; 
    } 

    function signUp(name, email, password, onSuccess, onError) { 
     $http.post('/api/auth/signup', { 
       name: name, 
       email: email, 
       password: password 
      }) 
      .then(function (response) { 
       localStorageService.set('token', response.data.token); 
       onSuccess(response); 
      }, function() { 
       onError(response); 
      }); 
    } 

    function login(email, password, onSuccess, onError) { 
     $http.post('api/auth/login', { 
       email: email, 
       password: password 
      }) 
      .then(function (response) { 
       localStorageService.set('token', response.data.token); 
       onSuccess(response); 
      }, function (response) { 
       onError(response); 
      }); 
    } 

    function logout() { 
     localStorageService.remove('token'); 
    } 

    function getCurrentToken() { 
     return localStorageService.get('token'); 
    } 

    return { 
     checkIfLoggedIn: checkIfLoggedIn, 
     signUp: signUp, 
     login: login, 
     logout: logout, 
     getCurrentToken: getCurrentToken 
    } 
}]);

문제는 콘솔 말하는 것입니다 :

Unknown provider: userServiceProvider <- userService <- LoginController

내가 컨트롤러의 의존성로 전달하는 시도했지만 내가 얻을 :

Failed to instantiate module bookApp due to: Error: [$injector:modulerr] http://errors.angularjs.org/1.5.7/ $injector/modulerr?p0=b...) at Error (native) at http://laravelangular.app/bower_components/angular/angular.min.js:6:412 at http://laravelangular.app/bower_components/angular/angular.min.js:40:134 at r (http://laravelangular.app/bower_components/angular/angular.min.js:7:355) at g (http://laravelangular.app/bower_components/angular/angular.min.js:39:222) at http://laravelangular.app/bower_components/angular/angular.min.js:39:391 at r (http://laravelangular.app/bower_components/angular/angular.min.js:7:355) at g (http://laravelangular.app/bower_components/angular/angular.min.js:39:222) at db (http://laravelangular.app/bower_components/angular/angular.min.js:43:246) at c (http://laravelangular.app/bower_components/angular/angular.min.js:20:359

출처

2016-07-10 Christian Giupponi

당신은 당신이

var app = angular.module('bookApp', [ 'ngRoute', 'bookServices', 'bookController' ]);

"컨트롤러의 의존성로 전달"가정 app.js에 bookApp 모듈 bookServices을 등록해야

출처

2016-07-10 15:46:27

게시 됨 그들은 별도의 모듈이기 때문에 이것은 작동하지 않을 것이다. – Noppey

메일 app.js 파일이 가장 적합하다. –

@Noppey : 다시 말해봐;) –

귀하의 userService 공장 bookServices 모듈에 살고있다. 이 모듈은 bookcontroller 모듈에 삽입되어 있지 않습니다. 사용 :

var bookController = angular.module('bookController', ['bookServices']);

출처

2016-07-10 15:38:03 Noppey

사용자 서비스와 컨트롤러는 별도의 모듈에 있습니다. BookController는 모듈에 UR bookServices 서비스 모듈을 주입하려고

var bookController = angular.module('bookController', ['bookServices']);

출처

2016-07-10 15:40:47

타임 스탬프를보십시오. 나는 대답을 쓰고 있지만 다른 대답은 –

AngularJS - 오류 : $ injector : unpr 알 수없는 공급자 userService

답변

관련 문제