app.js
var myApp = angular.module('myApp',[]);
myApp.controller('mainCtrl',function($scope){
$scope.name="vignesh";
});
I'm doing a basic app building with MEAN Stack, for most of the parts we use Node API's to connect with MongoDB and user authentication,I'm done with my authentication part in Node.js but while designing routing UI I'm facing this issue
HTML
<!DOCTYPE>
<html ng-app="myApp">
<head>
<title>User Story</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.16/angular.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.16/angular-route.js"></script>
</head>
<body>
<div ng-controller="mainCtrl">{{name}}</div>
<script type="text/javascript" src="/service/authService.js"></script>
<script type="text/javascript" src="/controllers/controllers.js"></script>
<script type="text/javascript" src="/app.js"></script>
</body>
</html>
angular.module('authService',[])
.factory('Auth',function($http,$q,AuthToken){
var authFactory={};
authFactory.login=function(username,password){
return $http.post('/app/login',{
username:username,
password:password
}). sucess(function(data){
AuthToken.setToken(data.token);
return data;
})
}
authFactory.logout=function(){
AuthToken.setToken();
}
authFactory.isLoggedin=function(){
if(AuthToken.getToken())
return true;
else
return false;
}
authFactory.getUser=function(){
if(AuthToken.getToken())
return $http.get('/api/me');
else
return $q.reject({message:"user has no token set"});
}
return authFactory;
})
. factory('AuthToken', function($window){
var authTokenFactory={};
authTokenFactory.getToken=function(){
return $window.localStorage.getItem('token');
}
authTokenFactory.setToken=function(token){
if(token)
$window.localStorage.setItem('token',token);
else
$window.localStorage.removeeItem('token');
}
return authTokenFactory;
})
.factory('AuthInterceptor',function($q,$location,AuthToken){
var interceptorFactory={};
interceptorFactory.request=function(config){
var token=AuthToken.getToken();
if(token){
config.header['x-access-token']=token;
}
return config;
};
interceptorFactory.responseError=function(response){
if(response.status==403)
$location.path('/login');
return $q.reject(response);
}
})
controllers.js
angular.module('mainCtrl', [])
.controller('MainController', function($rootScope,$location,Auth){
var vm = this;
vm.loggedIn = Auth.isLogged();
$rootScope.$on('$routechangeStart',function () {
vm.loggedIn=Auth.isLogged();
Auth.getUser().then(function(data){
vm.user=data.data;
});
});
vm.doLogin= function(){
vm.processing=true;
vm.error='';
Auth.login(vm.loginData.username, vm.loginData.password)
.sucess(function (data) {
// body...
vm.user=data.data;
});
if(data.success)
$location.path('/');
else
vm.erroe=data.message;
}
vm.doLogout=function(){
Auth.logout();
$location.path('/logout');
}
})
error says:
Uncaught SyntaxError: Unexpected token
Uncaught Error: [$injector:modulerr] Failed to instantiate module myApp due to: Error: [$injector:nomod] Module 'myApp' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
答案 0 :(得分:3)
您需要正确初始化app模块。
var myApp = angular.module('myApp', []);
<强>更新强>
由于每个JS文件都有不同的模块,因此您需要在使用该模块的任何提供者/服务时将它们组合在一起。在您的情况下,您使用了Auth
服务,但authService
模块没有注入。
<强> Controllers.js 强>
angular.module('mainCtrl', ['authService']) //injected authService module
.controller('MainController', function($rootScope,$location,Auth){
<强> App.js 强>
var myApp = angular.module('myApp',['mainCtrl']);
myApp.controller('mainCtrl',function($scope){