AngularJS: Comment arrêter la propagation de l'évènement à partir de ng-click?

J'ai directive qui fait quelque chose comme ceci:

app.directive('custom', function(){
    return {
        restrict:'A',
        link: function(scope, element){
            element.bind('click', function(){
                alert('want to prevent this');
            });

        }
    }
});

oui, il est nécessaire de faire jQuery-voie de liaison pour ce cas.

Et maintenant, je veux arrêter cette événement(clic) de propagation si certaines conditions remplies.

Essayé de faire:

  $event.stopPropagation();
  $event.preventDefault();

mais il n'a pas aidé.

ici le violon par exemple - http://jsfiddle.net/STEVER/5bfkbh7u/

Que voulez-vous dire "sans toucher à la présente directive"? Vous voulez faire de cette directive se comporter différemment - sans modifier son code? Comme avec la magie?
vous êtes de droite. il est assez déroutant. supprimé.

OriginalL'auteur Stepan Suvorov | 2015-02-18

7

Dans votre cas, vous ne pouvez pas arrêter propagtion car cliquez sur l'événement qui se passe sur le même élément, il y a juste deux des gestionnaires différents.

Cependant, vous pouvez tirer parti du fait que c'est la même objet d'événement à la fois contrôleur ngClick et dans la directive. Donc, ce que vous pouvez faire, c'est une propriété de cet objet d'événement et de les vérifier dans la directive:
```
$scope.dosomething = function($event){
    $event.stopPropagation();
    $event.preventDefault();
    alert('here');

    if (someCondtion) {
        $event.stopNextHandler = true;
    }
}
```
et dans la directive:
```
link: function(scope, element){
    element.bind('click', function(e) {
        if (e.stopNextHandler !== true) {
            alert('want to prevent this');    
        }
    });            
}
```
Démo: http://jsfiddle.net/5bfkbh7u/6/

belle astuce! 🙂 mais est-il possible de le faire sans ce "si!élément[0].stopEvent)"?
Oui, vérifiez la réponse de @James Décharnés, c'est encore plus intelligent.
Vérifier la nouvelle version, vous pouvez définir la propriété de l'objet d'événement, pas besoin de jouer avec l'élément.
merci! probablement la meilleure solution pour l'instant
Je suppose que e.stopImmediatePropagation(); aide à prévenir l'autre des gestionnaires sur le même élément

OriginalL'auteur dfsq
1

Avez-vous essayé de diminuer la priorité de la présente directive pour s'assurer qu'il se lie d'après le ng-cliquez sur la directive? Je suppose que les événements se déclenchent dans l'ordre où ils ont été tenus, qui est à son tour déterminée par la priorité de la ng-cliquez sur la directive vs votre directive.

Vous avez également besoin d'stopImmediatePropagation pour empêcher plus de gestionnaires sur le même élément de la cuisson. stopPropagation empêche la manifestation de leur propagation aux parents gestionnaires.

J'ai joué avec des priorités, mais peut-être que je n'était pas correcte. les deux directives a 0 priorité, non?
Oui ng-cliquez sur n', j'aimerais faire le vôtre -1, assurez-vous qu'il s'exécute par la suite, et l'utilisation stopImmediatePropagation au lieu de stopPropagation. stopPropagation de ne pas arrêter un événement de tir sur le même élément.
non, ne fonctionne pas

OriginalL'auteur James Gaunt
1
```
Use e.stopImmediatePropagation();
elem.bind('click', function (e) {
  if (disable(scope)){
    e.stopImmediatePropagation();
    return false;
  }

  return true;
});
```
Permettrait d'expliquer pourquoi stopPropagation n'a pas fonctionné et pourquoi vous attendre à stopImmediatePropagation de travail. Personnellement, je ne sais pas.
Alors que cet extrait de code, peut-être de résoudre la question, y compris une explication aide vraiment à améliorer la qualité de votre post. Rappelez-vous que vous répondez à la question pour les lecteurs dans l'avenir, et ces personnes pourraient ne pas connaître les raisons de votre code suggestion. - revue

OriginalL'auteur Manik Thakur
0

il ny a pas toute la propagation de l'évènement ici que vous avez le bouton et vous rencontrez des événements sur le même élément, ce n'est pas aller à l'élément parent de l'élément enfant, j'.e n cas de propagation ou de la capture de l'événement est ici

toutes les suggestions sur la manière d'arrêter gestionnaire personnalisé?

OriginalL'auteur A.B
0

Vous attachez les deux événements pour le bouton. Vérifiez l'élément lorsque vous vous inscrivez le deuxième événement
```
<div ng-controller="mainCtrl" custom>
    Hi! I'm the parent.
    <button ng-click="dosomething($event)">BUTTON</button>
</div>
```
Vitrine

est-il la solution? vous venez de supprimer "personnalisé" directive
non j'ai essayé de montrer pourquoi votre événement est encore tiré, même lorsque vous éviter la propagation. c'est la raison pourquoi je l'ai attaché à votre "custom" de l'événement à votre parent réel.
si votre question est "comment puis-je empêcher un deuxième joint déclenchement de l'événement?", alors vous servira principalement à vérifier-drapeau des solutions. dfsq fourni un

OriginalL'auteur Mx.

Vous devez vous connecter pour publier un commentaire.