从内部链接上的外部元素禁用ng点击

Question

我有一个使用UI-Router的站点，我有一个表，并且在单元格上有一个ng单击，但是单元格内有一个链接。当单击链接时，我需要禁用单元格的NG单击。

<div ng-click="click()" style="background: #d3d3d3">
  <a ui-sref="about">go to about page</a>
</div>

当我单击此链接时，我希望它转到"关于"页面，但不要调用点击函数。这是一个plnkr：http：//plnkr.co/edit/ke9czycyu1opa9s0k3jk？p = preview

这与我的实际站点有所不同，但这具有相同的行为（DIV而不是表）。我尝试添加ng-click="$event.preventDefault()"，但这也无法解决。

任何帮助将不胜感激。谢谢！

Answer 1

防止在 <a> tag上冒出事件的传播到div

<a ui-sref="about" ng-click="$event.stopPropagation()">go to about page</a>

另一种方法是检查单击"单击处理程序"的目标

<div ng-click="click($event)">

JS

$scope.click = function(e){
   if( e.target.tagName ==='A'){
       return; // skip click event handler
   }
    // rest of click code
}

Answer 2

您应该尝试$event.stopProgation()

<div ng-click="click();" style="background: #d3d3d3">
  <a ui-sref="about" ng-click="$event.stopProgation()">go to about page</a>
</div>

不会向父母传播事件。