How to split the tags automatically by special keyword?

404 Views Asked by At

I am developing an Angular 2+ web application in which I would like to copy the sentence like "User 1 | User 2 | User 3" in the text box and once I have copied , I expect it to be automatically converted into tags like in the picture below

enter image description here

Please notice that I have my sentence separated by pipe(|) symbol.

I have tried to use ngx-chips plugin and used pasteSplitPattern-[?string | RegExp]

But my tag is displayed like below

1

There are 1 best solutions below

3
On

You have to split your string something like that:

const tags = event.value.trim().split('|');

And then you'll be able to handle tags array (["User 1 ", " User 2 ", " User 3"]).

Depends on what do you need, you can use *ngFor or write additional logic in component.

That's the example with spitting on Space. You can change it to | : https://stackblitz.com/edit/angular-chipses?file=app/chips-autocomplete-example.ts