很抱歉代码很大但是我的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]，我真的不知道该怎么做。
＆＃34;请求＆＃34;对于角度模块位于部分视图_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>
感谢您的帮助！
答案 0 :(得分：0)
在最后一行中IIFE未正确关闭。你有：
}());
应该是：
})();
如：
(function ( /* IIFE enclosed code within this function*/) {
...
...
})(/* IIFE invoke*/);
此外，您正在向您的配置中注入根本不应该注入的服务。您可以在配置函数中使用服务，而无需像在控制器和服务中那样明确地注入它们，只需将它们作为函数参数。
为了促进更好的代码和实践，这是使用接近John Papa 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');
}
})();