如何从调用元素获取事件源

Question

我在列表项中有一个事件监听器：

        <li class="item" ng-click="click($event)">
            <a href="#/home">Home</a>
        </li>

在我的控制器中，我有一个点击处理程序：

 $scope.click = function($event) {      
        t2 = $($event.target.parentElement);
        t2.addClass('clicked');
}

但是，有时我的 $ event.target 是列表元素，有时候它是锚元素。这是因为我点击的位置，有时它位于元素上但不在列表中。有没有办法从事件对象中获取调用函数的元素？

Answer 1

使用$ event.currentTarget

 $scope.click = function($event) {      
    t2 = $($event.currentTarget.parentElement);
    t2.addClass('clicked');

}

Answer 2

不要弄乱控制器内的DOM。改为使用指令。

根据Angular JS Documentation

  

请勿使用控制器：

     

  
• 操纵DOM - 控制器应仅包含业务逻辑。将任何表示逻辑放入控制器会显着影响其可测试性。 Angular对大多数情况和指令进行数据绑定以封装手动DOM操作。
  

$scope.selectedId = null;

$scope.clickFn = function(e) {
    $scope.selectedId = e.currentTarget;
}

<强> HTML：

<li ng-class="{ 'clicked-class-name' : selectedId === 'someId' }" id="someId" ng-click="clickFn($event)">