Question

我正在尝试从代码库中的某个位置下载静态文件。我正在使用以下代码实现这一目标；

<div>
    <a [href]="'download/foo.csv'" class="btn btn-default" style="margin-left: 20px;" target="_blank" download="Foo.csv">
        Download Import File Template
    </a>
</div>

但是，下载文件Foo.csv时，其内容与index.html文件相同。为什么会这样？

index.html文件的内容如下所示。

<!DOCTYPE html>
<html lang="en">
<head>
    <base href="/">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto+Condensed|Source+Sans+Pro">
</head>
<body>
<div app></div>
<script type="text/javascript" src="/api/v2/config?plain=1"></script>
<script type="text/javascript" src="style.200453e6923c58c1d928.js"></script><script type="text/javascript" src="app.83fe6f9a0095f7b1bf2b.js"></script></body>
</html>

Answer 1

请尝试将CSV文件保存在assets文件夹中，该文件夹应该理想地保存在该文件夹中。然后尝试以下方法：

<div>
    <a 
    href="assets/sample.csv" 
    class="btn btn-default" 
    style="margin-left: 20px;" 
    target="_blank" 
    download="sample-file.csv">
        Download Import File Template
    </a>
</div>

这是您推荐的Working Sample StackBlitz。

PS：起作用的答案在于angular.json文件中存在的建筑物配置，我建议您签出该文件。

Angular 5文件下载问题-显示index.html内容

1 个答案: