使用 angularjs 自动生成下载链接答案

【问题标题】：auto generate download link with angularjs使用 angularjs 自动生成下载链接
【发布时间】：2016-10-24 21:04:04
【问题描述】：

我从这个脚本生成我的下载链接

https://github.com/joshpangell/single-use

例如：像这样生成的下载网址：

http://cloud.joshpangell.com/singleuse/download.php?key=key580e36b2ce7ff2.31652971&i=0

每次我通过 cronjob 生成密钥时，都会将密钥保存在 text.txt 中，如下所示：

key580e36b2ce7ff2.31652971

所以我的问题是如何在按钮下载中包含此密钥。

我是新手，请举例说明。

这是我的请求示例：

<html ng-app="dApp">
  <head>
    <meta charset="utf-8">
    <title>Download file</title>
    <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.1/angular.min.js"></script>
    <script>
      var dApp = angular.module('dApp', []);
      dApp.controller('dCtrl', function ($scope){
        $scope.dLink = 'text.txt';
        });
    </script>
  </head>
  <body ng-controller="dCtrl">
<a class= 'btn btn-primary' href="'/su/pathproduct/download.php?{dLink}' + '&i=0'">Download</a>

  </body>
</html>

【问题讨论】：

标签： angularjs angularjs-scope angular-ngmodel angularjs-ng-click

【解决方案1】：

试试这个：

<html ng-app="dApp">
<head>
  <meta charset="utf-8">
  <title>Download file</title>
  <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.1/angular.min.js"></script>
  <script>
    var dApp = angular.module('dApp', []);
    dApp.controller('dCtrl', function ($scope, $http) {
      // get a key from the text.txt file
      $http.get('text.txt').then(function (response) {
        $scope.dLink = response.data;
      });
    });
  </script>
</head>

<body ng-controller="dCtrl">
  <a class="btn btn-primary" 
     ng-if="dLink" 
     ng-href="/su/pathproduct/download.php?key={{ dLink }}&i=0'">Download</a>

</body>
</html>

添加了$http 请求，该请求从文本文件中获取密钥，然后将其设置为范围变量
在链接中添加了ng-if，因此当 dLink 为空时链接不可见

【讨论】：

【解决方案2】：

我注意到锚标记中可能存在三个错误。

使用 ng-href 代替 href
在 download.php 之后使用 {{dLink}} 而不是？您使用过 {dLink}
从 href 中删除单引号和加号

从 text.txt 中提取密钥并将其存储在 $scope.dLink 变量中

在锚标签href属性中调用变量时记得使用ng-href和两个{{}}

更新：

$scope.dLink = 'key580e36b2ce7ff2.31652971';

<a class= 'btn btn-primary' ng-href="/su/pathproduct/download.php?key={{dLink}}&i=0">Download</a>

有关 ng-href 的更多信息，请查看 Angular docs

【讨论】：

嗨@Chief 密钥每隔几个小时就会更改一次，所以我无法手动添加或提取密钥，我需要@Andriy 的第一个解决方案，谢谢您的尝试:)