gpt4 book ai didi

html - 如何将svg从文件导入 Angular 为5的组件中?

转载 作者:行者123 更新时间:2023-12-01 12:09:32 26 4
gpt4 key购买 nike

我发现所有将svg添加到AngularCli中的组件的教程都建议将其插入html模板中,如下所示:

<div>
<svg viewBox="0 0 250 250">
<svg:g class="group">
<svg:polygon class="shield" points="125,30 125,30 125,30 31.9,63.2 46.1,186.3 125,230 125,230 125,230 203.9,186.3 218.1,63.2" />
<svg:path class="a" d="M125,52.1L66.8,182.6h0h21.7h0l11.7-29.2h49.4l11.7,29.2h0h21.7h0L125,52.1L125,52.1L125,52.1L125,52.1
L125,52.1z M142,135.4H108l17-40.9L142,135.4z"/>
</svg:g>
</svg>
</div>

但我希望保持模板清晰,并仅将其中的几个标签与url插入分离的svg文件,如下所示:
<svg class="star">
<use xlink:href="../../../assets/images/svg/star.svg"
x="0"
y="0" />
</svg>

我如何在组件中使用单独的svg文件?

最佳答案

将SVG文件包括在src/assets文件夹中,并将svg文件夹添加到angular.json文件中。

"assets": [ "src/assets/svg/*" ]

这样,您可以根据需要将文件包括在组件中。

关于html - 如何将svg从文件导入 Angular 为5的组件中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53066823/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com