SAP SpartacusがカスタムCurrentProductServiceを注入する

import { Component, OnInit } from '@angular/core';
import { ActiveCartService, Product } from '@spartacus/core';
import { CurrentProductService } from '@spartacus/storefront';
import { Observable } from 'rxjs';

@Component({
  selector: 'app-mycom',
  templateUrl: './mycom.component.html',
  styleUrls: ['./mycom.component.scss']
})
export class MycomComponent implements OnInit {

  product$: Observable<Product> = this.currentProductService.getProduct();

  constructor(private currentProductService: CurrentProductService, private cartService: ActiveCartService
  ) {

  }

  ngOnInit(): void {
    this.product$.subscribe(product => console.log(product));
  }

}

CurrentProductServiceをコンストラクターに挿入します。ngOnInitでは、this.product $が変更されたときに製品のコンテンツを印刷します。

実行時の影響：製品の詳細ページを開くと、印刷された製品のjsonデータをコンソールで確認できます。

Jerryによるオリジナルの記事をさらに入手するには、パブリックアカウント「Wang Zixi」に従ってください。