Search code examples
ace-editorauto-indentpre

Ace editor not auto indenting

I have a string (from a buffer) that I have to put into an ace editor (like a pre tag) but when I add the string ace is not showing any indentation whereas a normal <pre></pre> and the console both show all indentation.

In the console I see the indentation!

console.log(d.code.toString());

enter image description here

But when I add it to ace:

$('#view').html(
    '<pre id="editor">'
+       (d.code.toString().replace(/\>/g,'&gt;').replace(/\</g,'&lt;'))
+   '</pre>'
    );
var editor = ace.edit("editor");
editor.setTheme("ace/theme/monokai");
editor.session.setMode("ace/mode/javascript");

enter image description here

Solution

  • Try using editor.session.setValue(d.code.toString()) instead of using html.

    or simply pass option to ace.edit

    var editor = ace.edit(null, {
    theme: "ace/theme/monokai",
    mode: "ace/mode/javascript",
    value: d.code.toString(),
});

    then append editor.container to the dom

    editor.container.id = "editor"
$('#view').append(editor.container)