来自 Internet 的自定义 Ionic 图标

Custom Ionic icon from Internet

我想像这样动态地使用离子图标:

<ion-icon src="https://eu.ui-avatars.com/api/?background=0D8ABC&color=fff"></ion-icon>

知道如何进行这项工作吗? (如果可能的话)

ion-icon 组件只接受具有 src='/path/to/file.svg' 属性的有效 .svg 文件。正如 Ionicon documentation.

所述

Custom icons To use a custom SVG, provide its url in the src attribute to request the external SVG file. The src attribute works the same as in that the url must be accessible from the webpage that's making a request for the image. Additionally, the external file can only be a valid svg and does not allow scripts or events within the svg element.

<ion-icon src="/path/to/external/file.svg"></ion-icon>

您的 src 属性中的图像是 .png 格式,而不是组件期望的 .svg 格式。这将导致组件不呈现图标。如果您改用 .svg,结果会如您所愿。