覆盖 footer/header 部分

Question

我试图通过定义修改带有出口的页脚部分：

<ng-container *ngIf="templateName$ | async">
        <ng-template *ngIf="true" cxOutletRef="footer">
        </ng-template>
</ng-container>

并且页脚部分未被替换。是否可以为特定模板替换 footer/header？作为此代码的结果，templateName 已从 PageLayoutService 正确解析，但替换不起作用。也尝试过

<ng-container *ngIf="(templateName$ | async) === expectedTemplateName">
        <ng-template cxOutletRef="footer">
        </ng-template>
</ng-container>

但仍然没有运气。有什么提示吗？ modify/change header 也很棒，谢谢！

Answer 1

自定义页面的 header/footer 有多种方法：

在 CMS 中实现自定义，您可以在其中为不同的页面设置不同的页面模板，包括备选 header/footer。这种方法最适合 Spartacus 的构建方式，因为页面是数据驱动的，并且组件映射是以通用方式完成的。您无需触摸 spartacus 代码即可获得不同的页眉和页脚。
使用您已经尝试过的插座。您面临的问题是，在解决页面模板时，页脚已经呈现，注册的插座不会产生任何影响。我可以想象这对网点的运作方式有点混乱。我在 Stackblitz 上为使用 outlets 的条件页脚创建了一个快速示例。
实现自定义根组件（替换 cx-storefront）并以自定义方式实现页脚。您可以利用页面布局和页面槽组件来呈现 CMS 内容。

希望能给您带来一两个想法。

这里有一些关于页面模板驱动的 classes 页面特定样式的更多信息。鉴于 header/footer 无法从基于 class 的页面模板中获益（因为它仅在路由器插座内可用），您可以在您的应用程序中实现它，我已经更新了 Stackblitz给你举个例子。

覆盖 footer/header 部分

Override footer/header section

spartacus-storefront