如何更改产品图像在 PDP 上的显示？斯巴达克斯

Question

我是 spartacus 的新手，angular 我正在尝试更改 spartacus 在 PDP 中默认带来的样式，更具体地说是图像组件。我想删除旋转木马并将图像一个放在另一个之上，因为它出现在水豚主题中。我为此制作了一个新组件，但我无法遍历图像，我无法在图像所在的产品对象中找到。

我试过{{product.images}}，{{product.images.GALLERY[0].product}} {{product.images.GALLERY[0].thumbnail} } 我得到 [Object Object]

提前致谢！

look like this

Answer 1

您可以用新创建的组件替换斯巴达克斯的 ProductImagesComponent，如下所示：

provideConfig(<CmsConfig>{
      cmsComponents: {
        ProductImagesComponent: {
          component: YourNewProductImageComponent,
        },
      },
    }),

在您新创建的组件中，您可以调用this.currentProductService.getProduct() 来获取当前产品。图片可以在 {{product.images.GALLERY[x].product}} 中找到。

Answer 2

尝试使用 cx-media 标签：

<cx-media class="cx-product-image"
                  [container]="product.images?.PRIMARY"
                  format="product"
                  [alt]="product.summary">
</cx-media>

如何更改产品图像在 PDP 上的显示？斯巴达克斯

How can change the display of the product images on the PDP? Spartacus

hybris

angularjs

spartacus-storefront