将 Mat-raised-Button HTML 链接到 PDF(Angular 6 + Material)

Question

下午好，

我有两个密切相关的问题： 1.当我单击以下代码时：

.HTML

<a mat-raised-button 
class="sample-button" 
color="primary" 
href="{{card.ButtonURL}}"
>{{card.Label}}</a>

对象引用(打字稿(：

{
Name:'Test PDF', cols: 1, rows: 1,
Label: 'Test PDF',
ButtonURL: '../pdfs/test.pdf',
imageURL: 'https://png.icons8.com/material/480/00457C/upload-link-document.png',
imageDesc: 'Test Description',
},

为什么<a mat-raised-button href="../pdfs/test.pdf"></a>在新窗口中更改 URL(见图 4(而不是打开测试.pdf？

2. 如果我有一个调查，并且想链接到一个文件以便从我的 Web 服务器下载，是否需要在 angular Web 应用程序中进行配置，或者我可以只指向服务器上的文件路径？

谢谢你的帮助，我是一个新手。

图像：

文件夹结构根目录

文件夹结构/src

应用程序截图

单击测试链接后的应用程序屏幕截图

Answer 1

首先，您必须将目标添加到<a>才能在新选项卡中打开它 例：

<a target="_blank" href="{{card.ButtonURL}}">{{card.Label}}</a>

其次，您必须确保网址有效，我的意思是这个位置确实有pdf。我建议您还将PDF文件放在资产文件夹中 - 默认为角度存储本地文件