共计 497 个字符，预计需要花费 2 分钟才能阅读完成。
首先创立一个新的 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 里：
最初的成果：
要获取更多 Jerry 的原创文章，请关注公众号 ” 汪子熙 ”:
正文完