angular js为a标签追加点击事件

来源:互联网 发布:unix和linux 编辑:程序博客网 时间:2024/05/22 13:04

使用例子: 再项目中,用到只能有一个按钮触发事件,由于是访问接口的方法,因此再按钮触发时,将接口访问地址返回,并访问即可完成该操作。但是一个a标签满足不了触发请求后台方法,又同时访问返回路径请求。

a标签用ng-href :

<a ng-href="{{pdfUrl}}" id="pdfExp" ></a> //后台返回的接口路径a1标签
<a href="javascript:void(0);" ng-click="pdfExport(item.REQUEST_KEY)" class="btn-blue">导出</a>
//a2标签 点击访问后台查询接口地址

遇到的问题:

 已经根据传入的值查到并返回接口访问地址,并复制到ng-href中,但是a1标签自动触发不能实现。以下几种方法是查到的,试过之后并不好用

方法:1)angular.element('#pdfExp').click();
方法:2) $("#pdfExp").click();
方法:3) angular.element("#pdfExp").click();
方法:4)document.getElementById("pdfExp").trigger('click')
方法:5)
$scope.pdfUrl = pdfUrl;//为a标签href赋值
document.getElementById("pdfExp").click(); //触发a点击事件
$("#pdfExp").trigger('click') ;//触发a点击事件
不知道什么原因,方法5可以实现下载,但是会有延迟,就是第一次点击是没有反应,第二次点击按钮,a标签事件才触发,下载的是第一次点击的文件,依次类推,第三次,下载的是第二次的文件
最终解决方案:
<a ng-href="{{pdfUrl}}"></a>
<a href="javascript:void(0);" ng-click="pdfExport(item.REQUEST_KEY)" >导出</a>
点击导出,获取路径,将路径赋值到第一个a标签,用window.open(url,'_self');来实现。
var pdfUrl = data.downloadUrl;//查到的路径
$scope.pdfUrl = pdfUrl;
window.open($scope.pdfUrl,'_self');



 



原创粉丝点击