0

如果用户空闲30分钟,我正在做自动注册的样例应用程序。在1分钟之前logOut必须向用户显示警告消息。引导警报消息不在ui-router下的角度运行块内工作?

所以我计算了分钟数并在Bootstrap中显示警告消息。 但警报消息在运行中不能正常显示。 Javascript警报工作正常,但Bootstrap警报不起作用。

app.run(function ($rootScope, $cacheFactory, $interval, $timeout) { 


    alert('1 more sec'); 

    function load() { 

     alert('you have 1 more sec to autoLogOut'); 
     $rootScope.showError = true; 
     $rootScope.error = "helloo"; 
     $rootScope.errorMessage = 'you have 1 more sec to autoLogOut'; 
     $timeout(function() { 
      $rootScope.doFade = true; 
     }, 2500); 
    } 





    // Execute every time a state change begins 
    $rootScope.$on('$stateChangeStart', function (event, toState, toParams, fromState, fromParams, $rootScope) { 


    load(); 

    }); 
}); 

它在里面运行块。

问题:

下不工作,以html:

<!DOCTYPE html> 
<html ng-app="app"> 

<head> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.js"></script> 
    <script data-require="[email protected] " data-semver="1.4.0 " src="https://code.angularjs.org/1.4.0/angular.js"></script> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"> </script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.3.2/angular-ui-router.js"></script> 
<script> 

var app = angular.module('app', ['ui.router']); 
app.run(function ($rootScope, $cacheFactory, $interval, $timeout) { 


    alert('1 more sec'); 

    function load() { 

     alert('you have 1 more sec to autoLogOut'); 
     $rootScope.showError = true; 
     $rootScope.error = "helloo"; 
     $rootScope.errorMessage = 'you have 1 more sec to autoLogOut'; 
     $timeout(function() { 
      $rootScope.doFade = true; 
     }, 2500); 
    } 





    // Execute every time a state change begins 
    $rootScope.$on('$stateChangeStart', function (event, toState, toParams, fromState, fromParams, $rootScope) { 


    load(); 

    }); 
}); 

</script> 
    </head> 

<body> 

    <div data-ng-show="showError" ng-class="{fade:doFade} " class="alert alert-danger "> 
    <strong>Error:</strong>{{errorMesage}} 
    <p> {{error}}</p> 
    </div> 
</body> 

</html> 

里面的$ stateChangeStart,它不工作。

回答

1

试图执行您的代码。在运行方法结束时错过了一个支架u。

var app = angular.module('app', []); 
app.run(function ($rootScope, $cacheFactory, $interval, $timeout) { 
     alert('you have 1 more sec to autoLogOut'); 

     $rootScope.showError = true; 
     $rootScope.error = "helloo"; 
     $rootScope.errorMessage = 'you have 1 more sec to autoLogOut'; 
     $timeout(function() { 
      $rootScope.doFade = true; 
     }, 2500); 

}); 

查看下面的蹲点。

https://plnkr.co/edit/jiTGGF60Lll8OpUXjHTs?p=preview

+0

同样的事情对我的作品,而拷贝我想念的代码,我的问题是引导警告消息不里面的角来看块的工作? Bootstrap警报在那里不起作用。我已更新您的链接https://plnkr.co/edit/55oBcDHAgjz7X72CYFFz?p=preview –