Javascript 覆盖整个角度应用的顶级模态对话框
我想使用一个模式实现一个登录对话框（来自AngularUIBootstrap项目）。 它应该覆盖整个应用程序，在背景中覆盖它，并且应该能够在AngularJS服务将变量设置为false时立即引发 我不喜欢使用登录页面的路由，因为我希望在应用程序中保留输入值 如何观察变量并正确触发模态对话框的open（）-函数Javascript 覆盖整个角度应用的顶级模态对话框,javascript,angularjs,angular-ui,angular-ui-bootstrap,Javascript,Angularjs,Angular Ui,Angular Ui Bootstrap,我想使用一个模式实现一个登录对话框（来自AngularUIBootstrap项目）。 它应该覆盖整个应用程序，在背景中覆盖它，并且应该能够在AngularJS服务将变量设置为false时立即引发 我不喜欢使用登录页面的路由，因为我希望在应用程序中保留输入值 如何观察变量并正确触发模态对话框的open（）-函数 编辑：我使用Thrift与服务器通信，因此在我的情况下，查看$http状态代码通常不容易…有几种方法可以做到这一点。由于modal本身就是一个服务，所以您可以直接从您的服务调用open。或
编辑：我使用Thrift与服务器通信，因此在我的情况下，查看$http状态代码通常不容易…有几种方法可以做到这一点。由于modal本身就是一个服务，所以您可以直接从您的服务调用open。或者，服务可以发布一个事件，有人可以监听并触发登录页面 如果您确实想查看特定变量（因为它可能会从不同的位置更改），可以在$rootScope上设置$watch，然后调用open 您可以使用module并使用它的$modal服务来显示登录模式，而无需重定向到任何其他页面 您可以在angular应用程序演示应用程序安全服务中找到相同的实现-
我建议您为此使用事件。诀窍是监视不成功的服务调用，假设您的后端让请求失败，并发送正确的访问被拒绝状态（403）。当链中有多个调用时，标志
$rootScope.isLogging<html ng-app="myApp">
</html>
angular-ui.bootstrap>=0.7我想他已经在说他正在使用angular-ui bootstrap的模式服务，他只是想从他的服务中找到触发它的方法。到目前为止，你得到了三个答案，选择一个：）我正在使用Thrift与服务器通信，所以在我的情况下，监视$http状态代码通常并不容易。。。
angular.module('myApp', ['ui.bootstrap.modal'])
.run(function($rootScope, $modal) {
$rootScope.isLoggingIn = false;
$rootScope.$on('showLoginDialogEvent', function (e, evtArgs) {
$rootScope.isLoggingIn = true;
$modal.open({
templateUrl: 'views/loginView.html',
controller: 'LoginDialogController'})
.result.then(function(){
$rootScope.isLoggingIn = false;
});
}
});
angular.module('requestInterceptor', [])
.config(function ($httpProvider) {
$httpProvider.interceptors.push('RequestInterceptor');
})
.factory('RequestInterceptor', function ($q, $rootScope) {
return {
'request': function (config) {
return config || $q.when(config);
},
'requestError': function(rejection) {
return $q.reject(rejection);
},
'response': function(response) {
return response || $q.when(response);
},
'responseError': function(rejection) {
if(!$rootScope.isLoggingIn && rejection.status === 403)
$rootScope.$broadcast('showLoginDialogEvent');
return $q.reject(rejection);
}
}
}