obter elemento original do ng-click

204

Eu tenho uma lista de itens em minha opinião ng-clickanexados a eles:

<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>

Estou manipulando os eventos de clique na foofunção na minha diretiva, passando $eventcomo uma referência ao objeto que foi clicado, mas estou obtendo uma referência à imgtag, em vez da litag. Então eu tenho que fazer coisas assim para obter o 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 uma maneira simples de obter a referência ao elemento que ng-clickestá vinculado, sem fazer operações DOM na minha diretiva?

angularjs angularjs-directive Ozrix
fonte

Respostas:

317

Você precisa em $event.currentTargetvez de $event.target.

Engenheiro
fonte
3
Obrigado, está funcionando. É estranho que a propriedade currentTarget no objeto $ event esteja definida como nula.
Ozrix
2
Definitivamente, isso é estranho ... se você registrar o objeto $ event, $ event.currentTarget parecerá nulo. No entanto, se você registrar a referência $ event.currentTarget, ela mostrará o elemento correto.
richardaday
6
Eu geralmente vou usar var elem = $event.currentTarget || $event.srcElement. Sempre foi mais amigável à navegação cruzada, mas não sei mais se é necessário.
WebWanderer
12
console.log mostra objetos mutáveis ​​profundos no último estado de execução, não no estado em que o console.log foi chamado. Veja stackoverflow.com/questions/22059811/…
Tivie
13

Não é uma resposta direta a essa pergunta, mas ao "problema" de $event.currentTargetaparentemente ser definido como nulo.

Isso ocorre porque o console.log mostra objetos mutáveis ​​profundos no último estado de execução, e não no estado em que o console.log foi chamado.

Você pode verificar isso para obter mais informações: Chamadas consecutivas para console.log produzem resultados inconsistentes

Tivie
fonte