我创建了一个下载音频文件的指令。单击指令标记时,我从服务器获取base64 编码数据并将锚标记(这是指令的模板)的“href”属性设置为获取的数据。然后我尝试以编程方式单击“a”标签,以便可以向用户显示文件下载弹出窗口。这里的问题是,当“点击”事件被触发时,它不会做任何事情,但在第二次手动点击时它会起作用。
我已经嵌入了小提琴代码。非常感谢任何帮助。以下是指令代码:
angular.module('myTestApp', [])
.directive('webDownloader', downloadFn);
downloadFn.$inject = ['$timeout'];
function downloadFn($timeout) {
function downloadLinkFn(scope, element) {
scope.fileName = scope.fileName || 'test-file';
scope.populateData = function() {
if (scope.dataURL) {
} else {
scope.webProvider()
.then(function (response) {
scope.dataURL =
'data:audio/ogg;base64,' + response;
$timeout(function() {
angular.element(element).
find('a').triggerHandler('click');
}, 0);
});
}
};
// Return the object.
return {
template: '<a data-ng-href="{{dataURL}}" download="{{fileName}}" data-ng-click="populateData()" data-ng-transclude></a>',
transclude: true,
restrict: 'A',
scope: {
fileName: '@',
webProvider: '&'
},
link: downloadLinkFn
};
}