Q:

How to show a warning message when user leaves without saving changes

I wrote a directive that watches for $locationChangeStart events and shows the user a message if the form has unsaved changes. The problem is that the event handler is never triggered. Here is simplified version of my code in notify-on-location-change.js
    (function() {
    'use strict';

    angular.module('myApp.directives').directive('notifyOnLocationChange', ['$scope', 'event', 'next', 'current', function ($scope, event, next, current) {

        $scope.$on('$locationChangeStart', function () {                
            if (true) {
                alert('Unsaved data!');
            }                

        });

        $scope.$on('$stateChangeStart', function () {                
            if (true) {
                alert('Unsaved data!');
            }                

        });

    }]);

})();

I then mark the form I want to trigger the warning:
 <form name="detailsForm" ng-submit="$ctrl.onSubmit()" novalidate notifyOnLocationChange>

notify-on-location-change.js is included in index.html
What am I missing here?

A:

Change the form attribute to notify-on-location-change
See https://stackoverflow.com/a/19503227/584846 for more details

