Monaco-editor: Is there a way to flag certain areas of plain text are Javascript expressions?

[jonnermut]

The use case is I have a template engine that behaves similarly to an ES6 templated string, with similar but not identical syntax:

Inside some plain text: ${ model.foo.bar } blah ${ maybeAFunctionCall() }

Or in at attribute in some xml: <someControl visible='${model.foo == "someValue"}' />

Inside the ${} is basically any javascript expression, with a bunch of well known globals (eg model in the examples). Beyond that ${? } means that exceptions are caught and not propogated, and there are a couple of other tokens.

Basically I would like to get code complete & syntax checking happening on the javascript expressions, both within my xml editor, and with a textbox. I already have the code complete I want working, in terms of adding a lib.d.ts etc in a plain monaco javascript editor. And I have the xml editor providing code complete in terms of what elements and attributes are valid.

Is there a way:

• to flag to the editor that certain regions are javascript?
• Or for the js editor to ignore certain bits?
• Or to feed the expression programmatically to monaco and get errors and code complete values?
• Or maybe to extend the JS editor with extra grammar (as opposed to writing a grammar from scratch)?

It actually almost works for the text box case by just wrapping the string in back ticks, spinning up the JS editor, and hiding the backticks... this gives pretty much everything I want except for the extra syntax such as ${? } which provokes a syntax error.

Any tips appreciated.