美文网首页SAP
在SAP Spartacus产品明细页面用outlet显示自定义

在SAP Spartacus产品明细页面用outlet显示自定义

作者: _扫地僧_ | 来源:发表于2020-11-24 10:32 被阅读0次

    首先创建一个新的Angular module和Component:

    这个新的module,因为要使用Outlet功能,所以需要从@Spartacus/storefront里导入OutletRefModule,以及导出我们自己实现的MyOutletsComponent以便让外界消费。

    MyOutletsComponent的实现:

    在构造函数里注入currentProductService, 调用getProduct方法异步读取当前product属性,存储在属性product$里:

    在这个Component的html里,显示product$的值:

    <ng-template cxOutletRef="ProductDetailsPageTemplate" cxOutletPos="before" let-model>
        <h1>Jerry</h1>
        <p>Product: {{ product$ | async | json }}</p>
    </ng-template>
    

    最后别忘了把Component的selector标签加到app Component的html里:

    最后的效果:

    相关文章

      网友评论

        本文标题:在SAP Spartacus产品明细页面用outlet显示自定义

        本文链接:https://www.haomeiwen.com/subject/vyllektx.html