Angular中如何根据条件动态设置download属性？

使用 Angular 的 attribute 绑定语法 [attr.*] 即可一行实现需求，该语法在绑定值为 null/undefined 时会自动从 DOM 上移除对应属性，完全匹配你的使用场景。

正确实现代码：

<a [attr.download]="item.isDownload ? '' : null" ...其他属性配置>锚点信息</a>

原理解释 #

• 你之前的写法属于直接绑定 download 的 DOM property，只要属性存在，无论赋值为 true 还是 false 都会触发下载行为，无法实现属性的动态移除。
• [attr.download] 是直接操作 HTML 原生 attribute：
  • 当 item.isDownload 为真时，属性赋值为空字符串，DOM 渲染结果为 <a download ...>，符合 HTML 布尔属性的生效规则。
  • 当 item.isDownload 为假时，属性赋值为 null，Angular 会直接把 download 属性从标签上完全移除，不会触发下载行为。

拓展用法 #

如果需要自定义下载文件的保存名称，直接把文件名变量传给 download 属性即可：

<a [attr.download]="item.isDownload ? item.saveFileName : null" [href]="item.fileUrl">下载文件</a>

内容的提问来源于stack exchange，提问作者Helmut Granda