javascript - Directive to create a[download] button -

i got save json file in client side here. code short in fiddle.

var = document.createelement('a'); a.download    = "backup.json"; a.href        = url; a.textcontent = "download backup.json";  document.getelementbyid('content').appendchild(a); 

i trying create angularjs directive calls method in scope data. along line.

module.directive('mydownload', function ($compile) {     return {         restrict:'e',         scope:{ getdata:'&getdata'},         link:function (scope, elm, attrs) {             elm.append($compile(                 '<a class="btn" download="backup.json"' +                     'href=' + scope.getdata() + '>' +                     'download' +                     '</a>'             )(scope));         }     }; }); 

this doesn't work. how can make linked fiddle directive?

how this: fiddle

here's directive code:

module.directive('mydownload', function ($compile) {   return {     restrict:'e',     scope:{ geturldata:'&getdata'},     link:function (scope, elm, attrs) {         var url = url.createobjecturl(scope.geturldata());         elm.append($compile(             '<a class="btn" download="backup.json"' +                 'href="' + url + '">' +                 'download' +                 '</a>'         )(scope));      }   }; }); 

controller:

module.controller('myctrl', function ($scope){   var data = {a:1, b:2, c:3};   var json = json.stringify(data);    $scope.getblob = function(){     return new blob([json], {type: "application/json"});   } });