使Mat-Raised-Button HTML链接到PDF(Angular 6 + Material)

路加

下午好,

我有两个密切相关的问题: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)而不是在新窗口中打开test.pdf?

  1. 如果我有一项调查,并且想要链接到要从Web服务器下载的文件,是否需要在角度Web应用程序中配置该文件,还是可以仅指向服务器上的文件路径?

谢谢您的帮助,我是新手。

图片:

文件夹结构根

文件夹结构/ src

应用程序的屏幕截图

单击测试链接后的应用程序屏幕快照

麦琪(MaciejWójcik)

首先,您必须添加目标以<a>在新选项卡示例中打开此目标

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

其次,您必须确保网址有效,我的意思是此位置中确实有pdf。我建议您也将PDF文件放在资源文件夹中-默认为angular来存储本地文件

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

Angular Material mat-radio-button 不会改变选择

Angular 6的“ mat-button-toggle”不是已知元素

如何在具有 mat-radio-group 的“selected”属性的 Angular Material 中选择 mat-radio-button?

如何使用Angular Material <mat-button-toggle>绑定到模型?

Angular 6和Angular Material-mat-radio-group [(ngModel)]在* ngFor内部设置动态变量

使用 [ngStyle] 将自定义颜色应用于 mat-raised-button

Angular 6 Material <mat-select>使用窗体控件设置多个默认值

Angular Material v6 Mat-Footer-“无法读取未定义的属性'template'”

如何使用Material在Angular 6中将Mat-chip绑定到ngmodel

Angular Material 6 Mat-Chip-List-两个Mat-chip-List声明共享同一数据源

带有验证错误(mat-error)的Angular6 Material自定义表单字段控件

Angular Material Mat Menu 禁用 matMenuTriggerFor

升级到Angular 6 / Material 6之后,为什么我要面对“ mat-input-container不是一个已知元素”?

Angular Material 6 和 Materializecss

Android Material Raised按钮处于不同状态

Angular-material-table :- 获取 mat-table 的错误

Angular Material Mat-table 不渲染数据

在“@angular/material”中找不到“MAT_DIALOG_DATA”

Angular 5 Material mat 选择:根据所选值进行过滤,

如何在Angular Material上更改Mat-icon的大小?

设置值后,Angular Material mat-select不刷新

如何过滤Mat-tree组件Angular Material 6.0.1

Angular Material mat-datepicker(更改)事件和格式

Angular Material Tab (mat-tab) 不显示内容

Angular Material => 从 formControlName 设置 mat-select 的值

Angular Material-Mat-Dialog-更改背景模糊/变暗效果

从Angular Material <mat-chip>移除盒子阴影

mat-date-range-input是未知元素[Angular material]

如何更改Angular Material的mat-slide-toggle属性?