How does the Monaco editor replace some text with widgets?

Viewed 173

I have some text like:

{A:B:C}test {A:D:EXP}

I want to display the text wrapped in curly braces like "{A: B: C}" as a widget, not above or below the text, but completely replace the text. What should I do?

Here is an example of codemirror:

enter image description here

and the text is:

{{front41635756023128.alerts.annotations.summaryCn}}
{{front41635756023128.alerts.labels.cluster}}test
{{front41635756023128.alerts.labels.container}}
{{front41635756023128.alerts.labels.host_ip}}
{{front41635756023128.alerts.labels.instance}}
{{front41635756023128.alerts.labels.job}}
{{front41635756023128.alerts.labels.node}}
{{front41635756023128.alerts.labels.pod}}

I want to use Monaco to achieve a similar effect.

1 Answers

I've done it simply by creating the widget at the location of the string. Then I removed the actual strings from the code, leaving only the widget.

Related