$http服务返回一个promise，它有两个回调方法，如下所示。

$http({method: 'GET', url: '/someUrl'}).
  success(function(data, status, headers, config) {
     var anchor = angular.element('<a/>');
     anchor.attr({
         href: 'data:attachment/csv;charset=utf-8,' + encodeURI(data),
         target: '_blank',
         download: 'filename.csv'
     })[0].click();

  }).
  error(function(data, status, headers, config) {
    // handle error
  });

网络上有关此问题的大多数参考资料都指出，您无法通过“开箱即用”的 ajax 调用下载文件。我见过涉及的（hackish）解决方案iframes以及像@dcodesmith's 这样的解决方案，它们可以工作并且完全可行。

这是我发现的另一个解决方案，它适用于 Angular 并且非常简单。

在视图中，csv按<a>以下方式用标记包裹下载按钮：

<a target="_self" ng-href="{{csv_link}}">
  <button>download csv</button>
</a>

（注意target="_self那里，在 ng-app 中禁用 Angular 的路由很重要，这里有更多关于它的信息）

在您的控制器中，您可以定义csv_link以下方式：

$scope.csv_link = '/orders' + $window.location.search;

（$window.location.search如果您想将额外的搜索查询传递给您的服务器，这是可选的，并且是onlt）

现在，每次单击该按钮时，它都应该开始下载。

var anchor = angular.element('<a/>');
anchor.css({display: 'none'}); // Make sure it's not visible
angular.element(document.body).append(anchor); // Attach to document

anchor.attr({
    href: 'data:attachment/csv;charset=utf-8,' + encodeURI(data),
    target: '_blank',
    download: 'filename.csv'
})[0].click();

anchor.remove(); // Clean it up afterwards

此代码适用于 Mozilla 和 chrome

这对 IE 11+、Firefox 和 Chrome 来说对我有用。在 safari 中，它下载一个文件，但未知且未设置文件名。

if (window.navigator.msSaveOrOpenBlob) {
    var blob = new Blob([csvDataString]);  //csv data string as an array.
    // IE hack; see http://msdn.microsoft.com/en-us/library/ie/hh779016.aspx
    window.navigator.msSaveBlob(blob, fileName);
} else {
    var anchor = angular.element('<a/>');
    anchor.css({display: 'none'}); // Make sure it's not visible
    angular.element(document.body).append(anchor); // Attach to document for FireFox

    anchor.attr({
        href: 'data:attachment/csv;charset=utf-8,' + encodeURI(csvDataString),
        target: '_blank',
        download: fileName
})[0].click();
anchor.remove();
}

使用角度 1.5.9

我通过将 window.location 设置为 csv 文件下载 url 让它像这样工作。经过测试，可与最新版本的 Chrome 和 IE11 配合使用。

角

   $scope.downloadStats = function downloadStats{
        var csvFileRoute = '/stats/download';
        $window.location = url;
    }

html

<a target="_self" ng-click="downloadStats()"><i class="fa fa-download"></i> CSV</a>

在php中为响应设置以下标头：

$headers = [
    'content-type'              => 'text/csv',
    'Content-Disposition'       => 'attachment; filename="export.csv"',
    'Cache-control'             => 'private, must-revalidate, post-check=0, pre-check=0',
    'Content-transfer-encoding' => 'binary',
    'Expires' => '0',
    'Pragma' => 'public',
];