AngularJS錯誤[$ injector：modulerr]

Question

對不起，有一大段代碼，但我的AngularJS模塊出現問題，按照these lessons創建。我想我的角模塊與ASP.NET MVC一起工作，但我甚至不能運行它。

(function() { 
    var AAngScript = angular.module('AAngScript', ['ngRoute']); 
    AAngScript.controller('LoginController', ['$scope', '$routeParams', '$location', 'LoginFactory', function ($scope, 
     $routeParams, $location, LoginFactory) { 
     $scope.loginForm = { 
      emailAdress: '', 
      password: '', 
      rememberMe: false, 
      returnUrl: $routeParams.returnUrl, 
      loginFailure: false 
     }; 
     $scope.login = function() { 
      var result = LoginFactory($scope.loginForm.emailAdress, $scope.loginForm.password, $scope.loginForm.rememberMe); 
      result.then(function (result) { 
       if (result.success) { 
        if ($scope.loginForm.returnUrl !== undefined) { 
         $location.path('/productcategory'); 
        } else { 
         $location.path($scope.loginForm.returnUrl); 
        } 
       } else { 
        $scope.loginForm.loginFailure = true; 
       } 
      }); 
     } 
    }]); 
    AAngScript.controller('RegisterController', ['$scope', '$location', 'RegistrationFactory', function ($scope, $location, RegistrationFactory) { 
     $scope.registerForm = { 
      emailAdress: '', 
      password: '', 
      confirmPassword: '', 
      registrationFailure: false 
     }; 

     $scope.register = function() { 
      var result = RegistrationFactory($scope.registerForm.emailAdress, $scope.registerForm.password, $scope.registerForm.confirmPassword); 
      result.then(function (result) { 
       if (result.success) { 
        $location.path('/routeOne'); 
       } else { 
        $scope.registerForm.registrationFailure = true; 
       } 
      }); 
     } 
    }]); 
    AAngScript.factory('AuthHttpResponseInterceptor', ['$q', '$location', function ($q, $location) { 
     return { 
      response: function (response) { 
       if (response.status === 401) { 
        console.log("Response 401"); 
       } 
       return response || $q.when(response); 
      }, 
      responseError: function (rejection) { 
       if (rejection.status === 401) { 
        console.log("Response Error 401", rejection); 
        $location.path('/login').search('retutnUrl', $location.path()); 
       } 
       return $q.reject(rejection); 
      } 
     } 
    }]); 
    AAngScript.factory('LoginFactory', ['$http', '$q', function ($http, $q) { 
     return function (emailAdress, password, rememberMe) { 

      var deferredObject = $q.defer(); 

      $http.post(
       '/Account/Login', { 
        Email: emailAdress, 
        Password: password, 
        RememberMe: rememberMe 
       } 
      ). 
      success(function (data) { 
       if (data == "True") { 
        deferredObject.resolve({ success: true }) 
       } else { 
        deferredObject.resolve({ success: false }) 
       } 
      }). 
      error(function() { 
       deferredObject.resolve({ success: false }) 
      }); 

      return deferredObject.promise; 
     } 
    }]); 
    AAngScript.factory('RegistrationFactory', ['$http', '$q', function ($http, $q) { 
     return function (emailAdress, password, confirmPassword) { 

      var deferredObject = $q.defer(); 

      $http.post(
       '/Account/Register', { 
        Email: emailAdress, 
        Password: password, 
        ConfirmPassword: confirmPassword 
       } 
       ). 
      success(function (data) { 
       if (data == "True") { 
        deferredObject.resolve({ success: true }); 
       } else { 
        deferredObject.resolve({ success: false }); 
       } 
      }). 
      error(function() { 
       deferredObject.resolve({ success: false }); 
      }); 

      return deferredObject.promise; 
     } 
    }]); 
    AAngScript.config('appConfig', ['$routeProvider', '$httpProvider', function ($routeProvider, $httpProvider) { 
     $routeProvider. 
     when('/register', { 
      templateUrl: 'Account/Register', 
      controller: 'RegisterController' 
     }) 
     .when('/login', { 
      templateUrl: '/Account/Login.html', 
      controller: 'LoginController' 
     }); 

     $httpProvider.interceptors.push('AuthHttpResponseInterceptor'); 
    }]); 
}()); 

總有一個錯誤[$injector:modulerr]，我真的不知道該怎麼辦。 「請求」對角模塊位於局部視圖_Layout這些代碼：

<html ng-app="AAngScript"> 
<head></head> 
<body> 
    @Styles.Render("~/Content/css") 
    @Scripts.Render("~/bundles/modernizr") 
    <script src="~/Scripts/angular.min.js"></script> 
    <script src="~/Scripts/angular-route.min.js"></script> 
    <script src="~/Scripts/AAngScript.js"></script> 
.... 
    @Scripts.Render("~/bundles/jquery") 
    @Scripts.Render("~/bundles/bootstrap") 
    @RenderSection("scripts", required: false) 
</body> 
</html> 

感謝您幫助我！

Answer 1

在您的最後一行IIFE未正確關閉。您有：

}()); 

應該是：

})(); 

如：

(function (/* IIFE enclosed code within this function*/) { 

    ... 
    ... 

})(/* IIFE invoke*/); 

---

此外，您注射服務到您的配置是不應該在被注入所有。您可以在配置函數中使用服務，而無需像在控制器和服務中那樣顯式注入它們，只需將它們作爲函數參數來使用即可。

在促進更好的代碼和做法，這是使用靠近約翰·爸爸的Angular Style Guide編碼標準代碼的興趣：

(function() { 

    // module definition 
    var AAngScript = angular.module('AAngScript', ['ngRoute']); 

    // Add controller to angular app 
    angular.module('AAngScript').controller('LoginController', LoginController); 

    // Inject dependencies to controller 
    LoginController.$inject = ['$routeParams', '$location', 'LoginFactory']; 

    // Define login controller 
    function LoginController($routeParams, $location, LoginFactory){ 

     // vm as in view-model 
     var vm = this; 

     vm.loginForm = { 
      emailAdress: '', 
      password: '', 
      rememberMe: false, 
      returnUrl: $routeParams.returnUrl, 
      loginFailure: false 
     }; 

     vm.login = function() { 
      var result = LoginFactory($scope.loginForm.emailAdress, $scope.loginForm.password, $scope.loginForm.rememberMe); 
      result.then(function (result) { 
       if (result.success) { 
        if ($scope.loginForm.returnUrl !== undefined) { 
         $location.path('/productcategory'); 
        } else { 
         $location.path($scope.loginForm.returnUrl); 
        } 
       } else { 
        $scope.loginForm.loginFailure = true; 
       } 
      }); 
     } 
    } 


    // Add controller to angular app 
    angular.module('AAngScript').controller('RegisterController', RegisterController); 

    // Inject dependencies to controller 
    RegisterController.$inject = ['$location', 'RegistrationFactory']; 

    // Define login controller 
     $routeParams, $location, LoginFactory) { 
     $scope.loginForm = { 
      emailAdress: '', 
      password: '', 
      rememberMe: false, 
      returnUrl: $routeParams.returnUrl, 
      loginFailure: false 
     }; 
     $scope.login = function() { 
      var result = LoginFactory($scope.loginForm.emailAdress, $scope.loginForm.password, $scope.loginForm.rememberMe); 
      result.then(function (result) { 
       if (result.success) { 
        if ($scope.loginForm.returnUrl !== undefined) { 
         $location.path('/productcategory'); 
        } else { 
         $location.path($scope.loginForm.returnUrl); 
        } 
       } else { 
        $scope.loginForm.loginFailure = true; 
       } 
      }); 
     } 
    }]); 
    function RegisterController ($location, RegistrationFactory) { 

     // vm as in view-model 
     var vm = this; 

     vm.registerForm = { 
      emailAdress: '', 
      password: '', 
      confirmPassword: '', 
      registrationFailure: false 
     }; 

     vm.register = function() { 
      var result = RegistrationFactory($scope.registerForm.emailAdress, $scope.registerForm.password, $scope.registerForm.confirmPassword); 
      result.then(function (result) { 
       if (result.success) { 
        $location.path('/routeOne'); 
       } else { 
        $scope.registerForm.registrationFailure = true; 
       } 
      }); 
     } 
    } 


    // Add factory to angular app 
    angular.module('AAngScript').factory('AuthHttpResponseInterceptor', AuthHttpResponseInterceptor); 

    // Inject dependencies to factory 
    AuthHttpResponseInterceptor.$inject = ['$q', '$location']; 

    // Define AuthHttpResponseInterceptor factory 
    function AuthHttpResponseInterceptor($q, $location) { 

     var factory = this; 

     factory.response = function (response) { 
      if (response.status === 401) { 
       console.log("Response 401"); 
      } 
      return response || $q.when(response); 
     } 

     factory.responseError = function (rejection) { 
      if (rejection.status === 401) { 
       console.log("Response Error 401", rejection); 
       $location.path('/login').search('retutnUrl', $location.path()); 
      } 
      return $q.reject(rejection); 
     } 

     // The factory object must be returned. Failure to do so results in an injection error 
     // from an undefined factory. 
     return factory; 
    }; 


    // Add factory to angular app 
    angular.module('AAngScript').factory('LoginFactory', LoginFactory); 

    // Inject dependencies to factory 
    LoginFactory.$inject = ['$http', '$q']; 

    // Define LoginFactory 
    function LoginFactory($http, $q) { 

     var factory = this; 

     factory.login = function(emailAdress, password, rememberMe){ 

      var deferredObject = $q.defer(); 

      $http.post(
        '/Account/Login', { 
        Email: emailAdress, 
        Password: password, 
        RememberMe: rememberMe 
       } 
      ). 
      success(function (data) { 
       if (data == "True") { 
        deferredObject.resolve({ success: true }) 
       } else { 
        deferredObject.resolve({ success: false }) 
       } 
      }). 
      error(function() { 
       deferredObject.resolve({ success: false }) 
      }); 

      return deferredObject.promise; 
     } 

     // The factory object must be returned. Failure to do so results in an injection error 
     // from an undefined factory. 
     return factory; 
    }; 


    // Add factory to angular app 
    angular.module('AAngScript').factory('RegistrationFactory', RegistrationFactory); 

    // Inject dependencies to factory 
    RegistrationFactory.$inject = ['$http', '$q']; 

    // Define RegistrationFactory 
    function RegistrationFactory($http, $q) { 

     var factory = this; 

     factory.register = function(emailAdress, password, rememberMe){ 

      var deferredObject = $q.defer(); 

      $http.post(
       '/Account/Register', { 
        Email: emailAdress, 
        Password: password, 
        ConfirmPassword: confirmPassword 
       } 
       ). 
      success(function (data) { 
       if (data == "True") { 
        deferredObject.resolve({ success: true }); 
       } else { 
        deferredObject.resolve({ success: false }); 
       } 
      }). 
      error(function() { 
       deferredObject.resolve({ success: false }); 
      }); 

      return deferredObject.promise; 
     } 

     // The factory object must be returned. Failure to do so results in an injection error 
     // from an undefined factory. 
     return factory; 
    }; 


    // Add configuration to angular app 
    angular.module('AAngScript').config(Routing); 

    // define configuration 
    function Routing($routeProvider, $httpProvider){ 

    $routeProvider. 
     when('/register', { 
      templateUrl: 'Account/Register', 
      controller: 'RegisterController' 
     }) 
     .when('/login', { 
      templateUrl: '/Account/Login.html', 
      controller: 'LoginController' 
     }); 

     $httpProvider.interceptors.push('AuthHttpResponseInterceptor'); 
    } 

})();