web-dev-qa-db-fra.com

récupère l'élément original de ng-click

J'ai dans ma vue une liste d'éléments auxquels ng-click est associé:

<ul id="team-filters">
    <li ng-click="foo($event, team)" ng-repeat="team in teams">
         <img src="{{team.logoSmall}}" alt="{{team.name}}" title="{{team.name}}">
    </li>
</ul>

Je gère les événements de clic dans la fonction foo de ma directive, en passant $event comme référence à l'objet sur lequel vous avez cliqué, mais je reçois une référence à la balise img , plutôt que la balise li. Je dois ensuite faire ce genre de choses pour obtenir le li:

$scope.foo = function($event, team) {
   var el = (function(){
       if ($event.target.nodeName === 'IMG') {
          return angular.element($event.target).parent(); // get li
       } else {
          return angular.element($event.target);          // is li
       }
   })();

Existe-t-il un moyen simple d'obtenir la référence à l'élément auquel est lié ng-click, sans effectuer d'opérations DOM dans ma directive?

195
Ozrix

Vous avez besoin de $event.currentTarget au lieu de $event.target.

307
Engineer

Pas une réponse directe à cette question mais plutôt à la "question" de $event.currentTarget apparemment être définie sur null.

Cela est dû au fait que console.log affiche les objets profondément modifiables au dernier état d'exécution, et non à l'état auquel le fichier console.log a été appelé.

Vous pouvez vérifier ceci pour plus d'informations: Les appels consécutifs à console.log produisent des résultats incohérents

13
Tivie