Angular material 如何将自定义svg图标和常规角度材质图标添加到同一个mat图标标记

使用Angular 8材质设计时，我遇到了一个问题，即我需要将自定义svg图标和内置/常规材质图标用于同一个mat图标标记

我正在运行一个循环来显示带有这些图标的菜单，其中包含一些菜单项。我使用的是常规材料，对于一些菜单项，我必须使用自定义图标（svg）

需要类似于：

{{menuIcon}

通常，我会有两个表示菜单项图标的属性：

• svgIcon

  这是SVG图标的名称

• 图标

  这是CSS字体图标的名称

菜单项将用以下界面表示：

导出接口菜单项{
/**菜单项的标题*/
标题：字符串；
/**菜单项的SVG图标。应使用此属性或“icon”属性*/
svgIcon？：字符串；
/**菜单项的图标。应使用此属性或“svgIcon”属性*/
图标？：字符串；
//其他属性
}

然后，我会根据是否设置了

svgIcon

或

图标

属性，有条件地显示相应的

：

{{item.icon}

或者，您可以在界面中使用

isSvgIcon

属性，该属性表示指定的图标是否为SVG图标：

{{item.icon}

感谢您的回复。这是我最后的选择。我正在寻找一些优化的替代方案（如果有的话）。但看起来就是这样。