我试图进行登录身份验证,我尝试使用angularJS显示进度来看,是这样的:
的app.config(函数($ locationProvider,$ routeProvider){ $ routeProvider 。什么时候('/', { 模板:, 控制器:的IndexController }) 。当('/主',{ templateUrl:意见/ main.html中, 控制器:MainController }) 。当('/登录',{ templateUrl:意见/ login.html的, 控制器:的LoginController }) 。当('/进步',{ templateUrl:意见/ progress.html', 控制器:ProgressController }) });VAR LOGGED_IN = FALSE;函数索引控制器($范围,$位置){ 如果(LOGGED_IN){ $ location.path(/主); }其他{ $ location.path(/登录); }}功能validateEmail(电子邮件){ VAR重= /^(([^<>()[\\]\\\\.,;:\\s@\\\"]+(\\.[^<>()[\\]\\\\.,;:\\s@\\\"]+)*)|(\\\".+\\\"))@((\\[[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}\\])|(([a-zA-Z\\-0-9]+\\.)+[a-zA-Z]{2,}))$/; 返回re.test(电子邮件);}功能的LoginController($范围,$位置){ $ scope.username =; $ scope.password =; $ scope.login =功能(){ 如果($ scope.username =!&放大器;&安培; $ scope.password!=){ 如果(!validateEmail($ scope.username)){ 警报(无效的邮件!); }其他{ $ location.path(/进展); 的setTimeout(函数(){// JUST FOR测试之前添加AJAX控件 LOGGED_IN = TRUE; $ location.path(/主); //不调用MainController并且不改变模板 },2000); } }其他{ 警报(用户名和放大器;密码obbligatori!); } }; $ scope.register =功能(){ };}功能ProgressController($范围){ $ scope.loading = TRUE;}功能MainController($范围){}
在这里progress.html包含
&LT; DIV NG秀=加载类='装入'&GT; &LT; IMG SRC =IMG / loading.gif'&GT;&LT; / DIV&GT;
解决方案
我认为你应该使用 $超时
http://$c$c.angularjs.org/1.2.13/docs/api/ng.$timeout
$超时(函数(){ LOGGED_IN = TRUE; $ location.path(/主);},2000);
当然,它需要注入的控制器$超时。
i'm trying to perform login auth and i'm trying to show a progress view using angularJS, something like:
app.config(function($locationProvider,$routeProvider) {
$routeProvider
.when('/', {
template: " ",
controller : IndexController
})
.when('/main', {
templateUrl : 'views/main.html',
controller : MainController
})
.when('/login', {
templateUrl : 'views/login.html',
controller : LoginController
})
.when('/progress', {
templateUrl : 'views/progress.html',
controller : ProgressController
})
});
var logged_in = false;
function IndexController($scope,$location){
if(logged_in){
$location.path("/main");
}else{
$location.path("/login");
}
}
function validateEmail(email) {
var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
return re.test(email);
}
function LoginController($scope,$location){
$scope.username = "";
$scope.password = "";
$scope.login = function(){
if($scope.username!="" && $scope.password!=""){
if(!validateEmail($scope.username)){
alert("Invalid e-mail!");
}else{
$location.path("/progress");
setTimeout(function(){ // JUST FOR TEST BEFORE ADD AJAX CONTROL
logged_in = true;
$location.path("/main"); // DOES NOT CALL MainController AND DOES NOT CHANGE TEMPLATE
},2000);
}
}else{
alert("Username & Password obbligatori!");
}
};
$scope.register = function(){
};
}
function ProgressController($scope){
$scope.loading = true;
}
function MainController($scope){}
where progress.html contains
<div ng-show="loading" class='loading'>
<img src='img/loading.gif'>
</div>
解决方案
I think you should use $timeout
http://code.angularjs.org/1.2.13/docs/api/ng.$timeout
$timeout(function(){
logged_in = true;
$location.path("/main");
},2000);
Of course it needs to inject $timeout in controller.