지시문 내 앵커 태그에서 AngularJS 클릭 이벤트를 프로그래밍

Question

오디오 파일을 다운로드하라는 지시문을 만들었습니다. 지시어 태그를 클릭하면 서버에서 base64로 인코딩 된 데이터를 가져 와서 가져온 데이터에 앵커 태그 (지시어의 템플릿 임)의 'href'특성을 설정합니다. 그런 다음 파일 다운로드 팝업을 사용자에게 표시 할 수 있도록 프로그래밍 방식으로 'a'태그를 클릭하려고합니다. 여기서 문제는 '클릭'이벤트가 트리거 될 때 아무것도하지 않지만 수동으로 클릭하면 두 번째로 작동한다는 것입니다.

나는 fiddle code을 삽입했습니다. 어떤 도움이라도 대단히 감사합니다. 난 아직 확실하지 않다하지만 angular.element(element).find('a')[0].click();와 angular.element(element).find('a').triggerHandler('click');를 교체하면 작동

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 
    }; 
} 

Answer 1

: 다음은 지시문 코드입니다.

업데이트 : href이 present.So없는 경우 코드가 작동합니다 위에 나는 scope.dataURL = '#'로 기본값을 설정하면 triggerHandler('click')이 작동하지 않습니다.