Angular ng-click $event передает дочерний элемент в качестве цели

Для каждого элемента td в таблице у меня есть прикрепленный ng-click. Вот (упрощенный) html для каждой ячейки таблицы:

<td ng-click="cellClicked($event)">
    <span ng-if="!cellEdit">{{event.eventName}}</span>
    <input type="text" ng-if="cellEdit" ng-model="event.eventName">
</td>

И моя (упрощенная) функция ng-click:

scope.cellClicked = function (event) {
  rowScope.cellEdit = true
  angular.element(event.target).find('input').focus()
}

Его цель:

• Пользователь нажимает на ячейку таблицы
• Ячейка меняет "режим редактирования"
• Дайте фокус элементу ввода, расположенному внутри td.

Сейчас это работает до тех пор, пока пользователь нажимает внутри элемента td, но не на элемент span:

console.log(angular.element(event.target)) #--> [td...] (as desired)

Однако, если пользователь нажимает на элемент span внутри td:

console.log(angular.element(event.target)) #--> [span...]

В этом случае использование задания фокуса не работает. Я надеялся получить доступ к родительскому элементу span, выполняя что-то вроде:

angular.element(event.target.closest('td'))

или

angular.element(event.target.parentNode)

Но он появляется, когда элемент проходит через событие $event и к нему обращается нет родительского контекста.

Как я могу:

• Предотвращение нажатия элемента span, запускающего td ng-click
• При щелчке элемента span пройдите через него html parent