通过外部HTML设置Quill.js的内容

Question

I try to set the content of quill.js with external html like this:

quill.container.querySelector('.ql-editor').innerHTML = myHtml;

But not all of the myHtml code is shown in the editor!

When I do this:

document.getElementById("editor").innerHTML = myHtml; 

The whole html is there but the edit functionality is not given (because inside of #editor there is .ql-editor which is overriden.

See here: https://fiddle.jshell.net/ppkxL2pd/16/

Feel free to change the two given possiblities to understand what I mean.

Why myHtml is not shown correctly?

Answer 1

The problem was with the way you were assigning html to myHtml variable.

You rightly used backtick as template literal but it doesn't seem to work in this particular case.

Solutions :

1. Keep entire html on single line. (Bad way). Working Demo here
2. Use \\ at the end of every line. Working Demo here