使用AngularJS下载文件

前端之家收集整理的这篇文章主要介绍了使用AngularJS下载文件前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我需要提供一个下载文件链接,链接必须被任何用户隐藏和访问,这是我的代码,没有任何错误,但我甚至无法打开下载对话框:

模板

<a ng-href="#" target="page" type="button" class="btn" 
ng-click="download()">Download</a>

脚本文件

$scope.download = function(){
 //here i need to know the code,can anybody explain me
}
首先,您不能“隐藏/不公开”基于Web的技术(HTML / CSS / JavaScript)应用程序中的链接.下载由客户端处理,因此下载/链接URL必须是公共的.您可以尝试“隐藏”保护性参数,例如下载URL中的ID使用后端执行的编程语言,如“PHP或node.js等”.通过这种方式,您可以创建哈希URL,如http://www.myside.com/download/359FTBW!S3T387IHS,以隐藏URL中的recordId等参数.

通过了解这一点,您的解决方案非常简单.只需使用HTML attribute download就像< a href =“http:// mydownloadurl”下载>链接文字< / a>强制浏览器下载href源.这里不需要ng-click.遗憾的是,Safari浏览器不支持下载属性.当浏览器处理下载本身时,这并不重要.根据用户系统OS配置,将下载文件或直接在该系统上安装的程序中打开该文件.例如,如果某些pdf查看器应用程序可用,则PDF文件将在PDF查看器中打开.

我写了一个Plunker,它在AngularJS控制器$scope中处理ng-href.我希望这是你需要的.

你的控制器:

var app = angular.module('plunker',[]);

app.controller('MainCtrl',function($scope) {
  $scope.fileHref = 'http://www.analysis.im/uploads/seminar/pdf-sample.pdf';
});

你的观点:

<head>
  <Meta charset="utf-8" />
  <title>AngularJS Plunker</title>
  <script>
    document.write('<base href="' + document.location + '" />');
  </script>
  <link rel="stylesheet" href="style.css" />
  <script data-require="angular.js@1.3.x" src="https://code.angularjs.org/1.3.14/angular.js" data-semver="1.3.14"></script>
  <script src="app.js"></script>
</head>

<body ng-controller="MainCtrl">
  <a ng-href="fileHref" download="yourFilename">Download</a>
</body>
</html>

猜你在找的Angularjs相关文章