如何配置新的 fontawesome 图标以将其与 ICON_TYPE 枚举一起使用
how to configure new fontawesome icon to use it with ICON_TYPE enum
需要配置新的 fontawesome 图标,定义如下 url。
https://github.com/SAP/spartacus/blob/7a590dcee2e3cb3fee7a148c88adde2ab9adda6d/projects/storefrontlib/src/cms-components/misc/icon/fontawesome-icon.config.ts
图标:fa fa-麦克风
请帮忙。
您可以使用 ConfigModule 配置图标 type。有多种方法可以做到这一点,我向您展示了一个所谓的提供程序的示例,但您也可以使用 ConfigModule 或 StorefrontModule 来实现。
providers: [
provideConfig({
icon: { symbols: { MIC: 'fas fa-microphone' } }
} as IconConfig)
]
请注意,我使用的是已经导入 Spartacus 的 fontawesome 版本。如果您切换到替代 资源 ,您必须注册该资源。您可以在文档中阅读更多相关信息:https://sap.github.io/spartacus-docs/icon-library/
然后您可以在组件中使用新的图标类型:
<cx-icon type="MIC"></cx-icon>
或作为指令:
<button cxIcon="MIC">I LIKE IT LOUD</button>
为了使用图标指令,您需要在托管组件的 Angular 模块中导入 IconModule
。
需要配置新的 fontawesome 图标,定义如下 url。 https://github.com/SAP/spartacus/blob/7a590dcee2e3cb3fee7a148c88adde2ab9adda6d/projects/storefrontlib/src/cms-components/misc/icon/fontawesome-icon.config.ts 图标:fa fa-麦克风
请帮忙。
您可以使用 ConfigModule 配置图标 type。有多种方法可以做到这一点,我向您展示了一个所谓的提供程序的示例,但您也可以使用 ConfigModule 或 StorefrontModule 来实现。
providers: [
provideConfig({
icon: { symbols: { MIC: 'fas fa-microphone' } }
} as IconConfig)
]
请注意,我使用的是已经导入 Spartacus 的 fontawesome 版本。如果您切换到替代 资源 ,您必须注册该资源。您可以在文档中阅读更多相关信息:https://sap.github.io/spartacus-docs/icon-library/
然后您可以在组件中使用新的图标类型:
<cx-icon type="MIC"></cx-icon>
或作为指令:
<button cxIcon="MIC">I LIKE IT LOUD</button>
为了使用图标指令,您需要在托管组件的 Angular 模块中导入 IconModule
。