如何基于任何条件禁用svg标签?

Question

如何在Angular中基于条件禁用svg标签?

try with [disabled]="true"但对我不起作用。在下面添加示例代码。

<span>
<svg role="presentation" (click)="show = !show">
<use [attr.xlink:href]="show ? '#arrow-top' : '#arrow-bottom'"></use>
</svg>
</span>

Answer 1

假设您希望基于showSVG变量禁用click。

在ts。

showSVG = true;

在模板:

<span>
Show/hide
<svg [style.pointerEvents]="showSVG ? 'auto' : 'none'" role="presentation" (click)="show = !show">
<use [attr.xlink:href]="show ? '#arrow-top' : '#arrow-bottom'"></use>
</svg>
</span>