ng-clickから元の要素を取得する

204

ビューにアイテムがng-click添付されたリストがあります。

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

fooディレクティブの関数でクリックイベントを処理し、クリックさ$eventれたオブジェクトへの参照として渡しますが、imgタグではなくタグへの参照を取得していますli。私は、取得するには、このようなものをしなければなりません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
       }
   })();

ng-clickディレクティブでDOM操作を行わずに、バインドされている要素への参照を取得する簡単な方法はありますか？

angularjs angularjs-directive

— オズリックス
ソース

回答:

317

の$event.currentTarget代わりに必要です$event.target。

— エンジニア
ソース

おかげで、それは働いています。$ eventオブジェクトのcurrentTargetプロパティがnullに設定されているのは奇妙です。

— Ozrix 14

これは間違いなく奇妙です... $ eventオブジェクトをログに記録すると、$ event.currentTargetはnullに見えます。ただし、$ event.currentTarget参照をログに記録すると、正しい要素が表示されます。

— リチャーダデイ2014

通常は使用しますvar elem = $event.currentTarget || $event.srcElement。それは常によりクロスブラウジフレンドリーでしたが、それが必要かどうかはわかりません。

— WebWanderer 2015年

console.logは、console.logが呼び出されたときの状態ではなく、実行の最後の状態で深い可変オブジェクトを示します。stackoverflow.com/questions/22059811/…を

— Tivie

この質問への直接の回答ではなく、$event.currentTarget明らかにnullに設定されるという「問題」への回答です。

これは、console.logが呼び出されたときの状態ではなく、実行の最後の状態でconsole.logが深い可変オブジェクトを表示するためです。

詳細については、これを確認できます。console.logを連続して呼び出すと、一貫性のない結果が生成されます

— Tivie
ソース