Question

实际上，我遇到了Angular的两个问题。我的第一步是在不同组件的购物篮中添加文章。我将对象发送到服务，第二个组件检索它...

我的第二个问题是，当我想拥有第二个产品时，我希望同时展示它们，而不要覆盖它。我一直在阅读以下内容：http://jasonwatmore.com/post/2018/06/25/angular-6-communicating-between-components-with-observable-subject是为了给我一些技巧...

在我看来，我添加了一个按钮：

<button class="btn btn-danger" (click)="onAddProduct()">Ajouter</button>

这是我的文章组成部分：

export class ProductComponent implements OnInit {
   @Input() private product: Product;
   private basketData: BasketdataService;

   constructor(private basketData: BasketdataService) {  }

   ngOnInit() {
   }
   onAddProduct() {
     console.log(this.product);
     this.basketData.onAddBasket(this.product);
   }
}

我在这里的服务检索数据并与购物篮组件共享

export class BasketdataService {
  private subject = new Subject<any>();

  onAddBasket(product: Product) {
    this.subject.next(product);
  }

  onGetBasket(): Observable<Product> {
    return this.subject.asObservable();

  }
  removeArticleBasket() {
    this.subject.next();
  }

这是我的basketComponent

export class BasketmenuComponent implements OnInit, OnDestroy {
  product : Product;
  subscription : Subscription;

  constructor(private basketdataService: BasketdataService) {
    this.subscription = this.basketdataService.onGetBasket().subscribe(message => { this.product = product; });
  }
  ngOnInit() {
  }
  ngOnDestroy() {
    // unsubscribe to ensure no memory leaks
    this.subscription.unsubscribe();
  }
}

我收到此错误：错误ReferenceError：在SafeSubscriber._next

中未定义产品

Answer 1

在basketComponent中有一个错误，请尝试以下操作：

$ kubectl apply

}

这不是“消息”，而是this.subscription中的“产品”

Angular 6-使用服务在组件之间发送对象

1 个答案: