web-dev-qa-db-ja.com

Ace-Editor JSON自動フォーマット/インデント

AceEditorを使い始めたばかりです。 doc "によると、エディターはプレーンテキストモードをサポートしています。他のすべての言語モードは、オンデマンドでロードされる個別のモジュールとして利用できます。 。 "これがJavaScriptモードの設定方法ですeditor.getSession().setMode("ace/mode/javascript");これは構文を強調表示する場合にのみ機能します.

私の場合、JSONを使用しています-editor.getSession().setMode("ace/mode/json")

私が達成しようとしているのは

  • うまくフォーマットされたJSON応答を表示する

問題は

  • エースエディタはeditor.setValue()でJSオブジェクトまたはJSONを処理できないようです。文字列に変換する必要があります

質問

  • <div id="editor"></div>に配置されている文字列に自動フォーマット/インデントを設定するにはどうすればよいですか?

HTML:

<div id="editor"></div>

SCRIPT:jsonDocはサーバーからのデータです

$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));
};
13

JSON文字列をフォーマットするには、JSON.stringifyの追加パラメーターを使用できます。のようなものを試してください

editor.setValue(JSON.stringify(jsonDoc, null, '\t'));

3番目のパラメーターは、レベルごとのインデントに使用されます。 (実装によって異なる場合があります)。例については、 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify を参照してください。

Ace.jsファイルから表示オプションを切り替えることもできます。

48
Syjin