Запрет запуска ng-click для диалогового окна подтверждения (перестал работать в Angular 1.2 RC3)

Я использую этот скрипт, чтобы иметь диалоговое окно подтверждения перед тем, как запустить функцию ng-click

Directives.directive('ngConfirmClick', [
  function(){
    return {
      priority: 100,
      restrict: 'A',
      link: function(scope, element, attrs){
        element.bind('click', function(e){
          var message = attrs.ngConfirmClick;
          if(message && !confirm(message)){
            e.stopImmediatePropagation();
            e.preventDefault();
          }
        });
      }
    }
  }
]);

как видно на http://zachsnow.com/#!/blog/2013/confirming-ng-click/

используется через:

<button ng-confirm-click="Are you sure?" ng-click="remove()">Remove</button>

Есть и другие подобные скрипты здесь, на SO, но с тех пор, как я обновил Angular 1.2 RC3, они перестали работать. Функция ng-click всегда запускается ДО того, как в нее вступит реальная функция связи.

Я также пытался повысить приоритет и прослушивать другие события (touchstart, потому что у новейшего angular есть эти новые директивы ngtouch). Но ничего не работает.

1 ответ

Решение

Ах, я понял это сам!

Недавно команда разработчиков Angular изменила приоритет ссылок до и после публикации: https://github.com/angular/angular.js/commit/31f190d4d53921d32253ba80d9ebe57d6c1de82b

Теперь это включено в Angular 1.2 RC3!

Поэтому функция пост-связывания теперь имеет обратный приоритет.

Таким образом, есть два способа решить это. Либо используйте отрицательный приоритет сейчас

Directives.directive('ngConfirmClick', [
  function(){
    return {
      priority: -100,  //<---------
      restrict: 'A',
      link: function(scope, element, attrs){
        element.bind('click', function(e){
          var message = attrs.ngConfirmClick;
          if(message && !confirm(message)){
            e.stopImmediatePropagation();
            e.preventDefault();
          }
        });
      }
    }
  }
]);

ИЛИ преобразовать функцию в функцию предварительного связывания

Directives.directive('ngConfirmClick', [
  function(){
    return {
      priority: 100,
      restrict: 'A',
      link: {
          pre: function(scope, element, attrs){ //<---------
                element.bind('click touchstart', function(e){
                  var message = attrs.ngConfirmClick;
                  if(message && !window.confirm(message)){
                    e.stopImmediatePropagation();
                    e.preventDefault();
                  }
                });
              }
        }
    }
  }
]);
Другие вопросы по тегам