angular4点击事件监听_angularjs 监听 文档click 事件

项目 上遇到  innHTML  放入 一大段的html 内容 中带有 click 事件 如οnclick="callInMethod("http://www.crm.bmcc.com.cn/kb/cs/kb/knowledge/jsspan.html?methodName=openRelateDoc&docId=2015070102GJ225722&docName=扣费主动提醒和业务订购二次确认服务")" 这样的事件 ，由于要在指定的ng-controller 内获取 onclick  函数 内的 指定 id 值。所以不得不监听  获取 这个点击事件。

为了让我的控制器能够对文档层面上的鼠标事件有所反应，我必须创建一个自定义AngularJS指令，它将会把DOM节点和控制器的$scope方法“粘合”起来。在下面的例子中，我创建了“bnDocumentClick”属性指令：

bn-docuemnt-click="handleClick($event)"

这个指令将会在当前控制器的$scope对象的上下文中处理这个给定的表达式。在下面的例子中，$event对象其实就是潜在的jQuery事件对象。

mIndex.directive("bnDocumentClick",function( $document, $parse ){//将Angular的上下文链接到DOM事件

var linkFunction = function( $scope, $element, $attributes ){//获得表达式

var scopeExpression =$attributes.bnDocumentClick;//使用$parse来编译表达式

var invoker =$parse( scopeExpression );//绑定click事件

$document.on("click",function( event ){//当点击事件被触发时，我们需要再次调用AngularJS的上下文。再次，我们使用$apply()来确保$digest()方法在幕后被调用

$scope.$apply(function(){//在scope中调用处理函数，将jQuery时间映射到$event对象上

invoker(

$scope,

{

$event: event

}

);

}

);

}

);//当父控制器被从渲染文档中移除时监听"$destory"事件

};//返回linking函数

return( linkFunction );

}

);

指定 范围的标签 加入

controller中内容如下 ：

$scope.handleClick = function( event ){if(event.target.parentNode.parentNode.href=="javascript:"){

console.log(event.target.parentNode.parentNode)var cc =event.target.parentNode.parentNode

console.log(cc.getAttribute("onclick"))

alert(cc.getAttribute("onclick"))var dd =cc.getAttribute("onclick").split("docId")[1].split("&")[0].split("=")[1]

console.log(dd)

}

};