我试图孤立地展示边缘案例问题,其中svg的使用标签在某些条件下不会从href加载外部资产。
我尝试在plunkr中运行此功能以分享我的问题并寻找解决方案,但无法使用finded[j_index]=NULL;
标记将图像加载到所有。
以下是角度模板的代码:
<use>
和<svg xmlns="http://www.w3.org/2000/svg"
focusable="false"
[attr.height]="height"
[attr.width]="width"
[attr.viewbox]="viewbox">
<use #use
[attr.viewbox]="viewbox"
attr.href="{{ path || 'icon.svg' }}"
attr.width="100%"
attr.height="100%">
</use>
</svg>
发布在以下位置:
icon.svg
如何在plunkr上使用<svg fill="#000000" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg">
<path d="M20 2H4c-1.1 0-1.99.9-1.99 2L2 22l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-7 9h-2V5h2v6zm0 4h-2v-2h2v2z"/>
<path d="M0 0h24v24H0z" fill="none"/>
</svg>
显示svg?
这是一个问题吗?
我误解了如何使用<svg><use href="…">
?
答案 0 :(得分:0)
<use>
元素不能指向完整的svg文件,它们需要指向该文件中的某个元素。
Unlike ‘image’, the ‘use’ element cannot reference entire files.