显示angularjs警告用户离开页面时 [英] Showing alert in angularjs when user leaves a page

问题描述

我是一个angularjs新蜂。我想，当他试图关闭浏览器窗口来写它提醒用户验证。

我有我的网页V1 2链接和v2.When点击它采取的特定页面的链接。
这里是code重定向到v1和v2

  angular.module（'对myApp'，['myApp.filters'，'myApp.services'，'myApp.directives']）的.config（['$ routeProvider'，函数（$ routeProvider）{
        $ routeProvider.when（'/ V1'，{templateUrl：'页/ v_1.html'，控制器：MyCtrl1}）;
        $ routeProvider.when（'/ V2'，{templateUrl：'页/ v_2.html'，控制器：MyCtrl2}）;
        $ routeProvider.otherwise（{redirectTo：'/ V1'}）;
}]）;
 

我想弹出一个消息时V1用户点击了他即将从V1离开，如果他希望继续，并在相同的点击V2。
关于如何实现这一目标的任何指针将AP preciated。

我得到一个答案<一个href=\"http://stackoverflow.com/questions/13885718/in-angularjs-how-to-detect-when-user-leaves-template-page\">here但每次时间间隔后弹出的消息。

更新code; 的

控制器

 函数MyCtrl1（）{
    $范围。在（'$ locationChangeStart'，函数（事件，接下来，电流）{$
        如果（你的病情'）{
            。事件preventDefault（）;            MessageService.showConfirmation（
                '你确定？'，
            MessageService.MessageOptions.YES_NO，{
                'YES'：功能（）{
                    blockNavigation = FALSE;
                    $ location.url（$ location.url（下）.hash（））;
                    $ rootScope $适用（）。
                }，
                'NO'：功能（）{
                    MessageService.clear（）;
                    $ log.log（'没有选择'）
                }
            }）;
        }
    }）;
}
。MyCtrl1 $注射= [];
功能MyCtrl2（）{}
。MyCtrl2 $注射= [];
 

解决方案

在code的确认对话框可以写成短是这样的：

  $范围。在$（'$ locationChangeStart'，函数（事件）{
    VAR答案=确认（你确定要离开这个页面吗？）
    如果（！回答）{
        。事件preventDefault（）;
    }
}）;
 

I'm an angularjs new bee. I'm trying to write a validation which alerts the user when he tries to close the browser window.

I have 2 links on my page v1 and v2.When clicked on the links it takes to the specific pages. Here is the code to redirect to v1 and v2

angular.module('myApp', ['myApp.filters', 'myApp.services', 'myApp.directives'])

.config(['$routeProvider', function($routeProvider) {
        $routeProvider.when('/v1', {templateUrl: 'pages/v_1.html', controller: MyCtrl1});
        $routeProvider.when('/v2', {templateUrl: 'pages/v_2.html', controller: MyCtrl2});
        $routeProvider.otherwise({redirectTo: '/v1'});
}]);

I want to pop up a message when the user clicks on v1 that "he's about to leave from v1, if he wishes to continue" and same on clicking on v2. Any pointers on how to achieve this would be appreciated.

I got an answer here but it pops up the message after every time interval.

Updated Code;

Controllers

function MyCtrl1() {
    $scope.$on('$locationChangeStart', function (event, next, current) {
        if ('your condition') {
            event.preventDefault();

            MessageService.showConfirmation(
                'Are you sure?',
            MessageService.MessageOptions.YES_NO, {
                'YES': function () {
                    blockNavigation = false;
                    $location.url($location.url(next).hash());
                    $rootScope.$apply();
                },
                'NO': function () {
                    MessageService.clear();
                    $log.log('NO Selected')
                }
            });
        }
    });
}
MyCtrl1.$inject = [];


function MyCtrl2() {}
MyCtrl2.$inject = [];

解决方案

The code for the confirmation dialogue can be written shorter this way:

$scope.$on('$locationChangeStart', function( event ) {
    var answer = confirm("Are you sure you want to leave this page?")
    if (!answer) {
        event.preventDefault();
    }
});

这篇关于显示angularjs警告用户离开页面时的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！