CODEWITHSUNDEEP
angularngx-chips
user3255061
user3255061

Reputation: 1815

ngx-chips: adding to other input field onRemove doesn't work

I'm using https://github.com/Gbuomprisco/ngx-chips with two input fields. If a tag gets removed from the first input ("likes") it gets added to the second input ("dislikes).

This doesn't work if there is some input in the second field first.

TS:

public likes = [];
public dislikes = [];

onLikeRemove(tag) {
  this.dislikes.push(tag);
  console.log(this.dislikes);
}

HTML:

<tag-input [ngModel]="likes" (onRemove)="onLikeRemove($event)">
</tag-input>

<tag-input [ngModel]="dislikes">
</tag-input>

Demo: https://stackblitz.com/edit/ngx-chips-example-5ajdec?file=app/shared/tag-input/tag-input.component.html

Steps to reproduce:

1) Add a tag to "dislikes"

2) Add a tag to "likes"

3) Remove the tag from likes - it should be added to dislikes, but that doesn't work.

Is this a bug in the library or am I getting something more basic wrong?

Upvotes: 0

Views: 3014

Answers (1)

Prachi
Prachi

Reputation: 3574

Use two way binding in your code to reflect the changes on UI:

<tag-input [(ngModel)]="likes" (onRemove)="onLikeRemove($event)">
</tag-input>

<tag-input [(ngModel)]="dislikes">
</tag-input>

Upvotes: 2

Related Questions