title: Ace-Editor JSON auto format/indent
body: <p>I have just started using Ace Editor. According to the <a href="http://ace.c9.io/#nav=howto" rel="noreferrer">doc</a> <strong><em>"the editor supports plain text mode. All other language modes are available as separate modules, loaded on demand..."</em></strong> and this is how a JavaScript mode is set <code>editor.getSession().setMode("ace/mode/javascript");</code> this only works for highlighting syntax. </p>
  
  <p>In my case I am working with JSON - <code>editor.getSession().setMode("ace/mode/json")</code></p>
  
  <p><strong>What I am trying to achieve is</strong></p>
  
  <ul>
  <li>Display a nicely formatted JSON response</li>
  </ul>
  
  <p><strong>Problem is</strong></p>
  
  <ul>
  <li>Ace Editor can't seem to handle JS objects or JSON on
  <code>editor.setValue()</code> it has to be converted to a string</li>
  </ul>
  
  <p><strong>Question</strong></p>
  
  <ul>
  <li>How do I set auto format/indentation on the string which is placed on 
  <code>&lt;div id="editor"&gt;&lt;/div&gt;</code>?</li>
  </ul>
  
  <p><strong>HTML:</strong> </p>
  
  <p><code>&lt;div id="editor"&gt;&lt;/div&gt;</code></p>
  
  <p><strong>SCRIPT:</strong> <em><code>jsonDoc</code></em> is data from the server</p>
  
  <pre><code>$scope.getData = function (jsonDoc) {
    var editor = ace.edit("editor");
    editor.getSession().setMode("ace/mode/json");
    editor.setTheme("ace/theme/twilight");
    editor.getSession().setTabSize(2);
    editor.getSession().setUseWrapMode(true);
    editor.setValue(JSON.stringify(jsonDoc));
  };
  </code></pre>