productIdが異なる場合にイベントを上書きしないようにするにはどうすればよいですか？

Question

私は製品のリストを持っています。各製品にはidとdescriptionがあります。

<div *ngFor="let product of products"> 
    <input type="text" [ngModel]="product.description" (ngModelChange)="onEdit($event, product.id)"> 
</div> 

---

editStream: EventEmitter<any> = new EventEmitter(); 

ngOnInit() { 
    this.editStream 
    .debounceTime(1000) 
    .distinctUntilChanged() 
    .mergeMap(x => Observable.of(x)) 
    .subscribe(x => { 
     // based on product id, update its description in the database 
    }); 

} 

private onEdit(description: string, id: string) { 
    this.editStream.emit({ description, id }); 
} 

私は1つの製品の説明を編集するときにはうまく動作します。私はproduct1編集する場合

しかし、（時間間隔が1秒未満である）すぐの記述の説明をし、product2を編集 '、唯一product2の説明が更新されます。

product2さんのイベントはproduct1さんのイベントを上書きしているので、1か所だけ登録しています。

どうすればこの問題を解決できますか？ありがとう

Answer 1

distinctUntilChanged()を使用する場合は、それぞれproductに異なるObservableが必要です。

this.products.forEach(p => this.editStreams.push(new EventEmitter()) 

<div *ngFor="let product of products let i=index"> 
    <input type="text" [ngModel]="product.description" (ngModelChange)="onEdit($event, i, product.id)"> 
</div> 

private onEdit(description: string, id: string) { 
    this.editStreams[i].emit({ description, id }); 
}