本文共 1431 字，大约阅读时间需要 4 分钟。

Spartacus界面上的banner，如下图所示，对应着HTML源代码里的cx-banner标签：

cx-banner下面是cx-generic-link:

这个cx-generic-link包含一个a标签，指向一个超链接：

a标签里包含cx-media, 再包含img.

这个映射关系在下图高亮处的代码被访问：

/**     * Return collection of component mapping configuration for specified list of     * component types.     *     * If component mapping can't be determined synchronously, for example, lazy     * loaded one, it will throw an error.     *     * To make sure component mapping is available, determineMappings()     * should be called and completed first.     */    getMapping(componentType) {
           var _a, _b;        const componentConfig = (_a = this.mappings[componentType]) !== null && _a !== void 0 ? _a : (_b = this.config.cmsComponents) === null || _b === void 0 ? void 0 : _b[componentType];        if (!componentConfig) {
               if (!this.missingComponents.includes(componentType)) {
                   this.missingComponents.push(componentType);                console.warn(`No component implementation found for the CMS component type '${
     componentType}'.\n`, `Make sure you implement a component and register it in the mapper.`);            }        }        return componentConfig;    }

在SAP Spartacus里有很多种办法提供CMS Component到Angular Component的映射关系，比如下图：

第47行是CMS Component，第48行的MycomComponent是我创建的Angular Component：

上图的映射关系，运行时被解析成下图所示的数据：

如果改成MyOutletsComponent：

运行时解析出来的Angular Component也变成了MyOutletsComponent：

要获取更多Jerry的原创文章，请关注公众号"汪子熙":

转载地址：https://jerry.blog.csdn.net/article/details/108506868 如侵犯您的版权，请留言回复原文章的地址，我们会给您删除此文章，给您带来不便请您谅解！