具有特定格式的分割字符串Angular 6，Typescript

Question

I am trying to use regex with javascript, I have the following list:

word1 @['id1', 'name1']@ @['id2', 'name2']@ @['id3', 'name3']@ word2 @['id4', 'name4']@ word3 @['id5', 'name5']@

I want to detect everything has: @[' ..... ']@ and split them like that:

word1
@['id1', 'name1']@
@['id2', 'name2']@
@['id3', 'name3']@
word2
@['id4', 'name4']@
word3
@['id5', 'name5']@

So I can read the id and the name later to be able to create a link:

<a href="url/[id]">[name]</a>

I have tried this regex:

[@\['](.)*['\]@]

But it is just mark everything from the first @[' till the end at name5.

Simple code:

const reg = /[@\['](.)*['\]@]]/;
const arr = content.split(reg);

If anybody knows how to split it, I would appreciate sharing the solution. Thank you!

Answer 1

Instead of split , consider .match , which may make the logic easier: either match word characters, or match @[ , followed by any characters, followed by ]@ :

\w+|@\[.*?\]@

 const input = `word1 @['id1', 'name1']@ @['id2', 'name2']@ @['id3', 'name3']@ word2 @['id4', 'name4']@ word3 @['id5', 'name5']@`; console.log(input.match(/\\w+|@\\[.*?\\]@/g)); 

If the inside of the [] may contain ]@ s you don't want to match, such as @['id1', ']@', 'name1']@ , then you'll need a bit more logic - inside the [] s, repeat groups of ' or " delimited strings:

\w+|@\[(?:(?:'[^']+'|"[^"]+")(?:, *|(?=\])))*\]@

https://regex101.com/r/rDW2iD/1

Answer 2

You may split the string using

s.split(/\s*(@\[.*?]@)\s*/).filter(Boolean)

See the JS demo:

 var s = "word1 @['id1', 'name1']@ @['id2', 'name2']@ @['id3', 'name3']@ word2 @['id4', 'name4']@ word3 @['id5', 'name5']@"; console.log(s.split(/\\s*(@\\[.*?]@)\\s*/).filter(Boolean)); 

The pattern matches 0+ whitespaces, then captures @[ , any 0+ chars other than line break chars, as few as possible, up to the first ]@ , and then matches without capturing 0+ whitespaces. The captured substrings land in the resulting array, and .filter(Boolean) removes empty items.