獲取摩納哥編輯器的價值

微軟最近開放源代碼他們的摩納哥編輯器（類似於ace/codemirror）。獲取摩納哥編輯器的價值

https://github.com/Microsoft/monaco-editor

我已經得到了它，並在瀏覽器中運行，但仍然無法弄清楚如何讓編輯器的當前文本，就像如果我想保存它。

例子：

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge" /> 
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" > 
</head> 
<body> 

<div id="container" style="width:800px;height:600px;border:1px solid grey"></div> 

<script src="monaco-editor/min/vs/loader.js"></script> 
<script> 
    require.config({ paths: { 'vs': 'monaco-editor/min/vs' }}); 
    require(['vs/editor/editor.main'], function() { 
     var editor = monaco.editor.create(document.getElementById('container'),     { 
      value: [ 
       'function x() {', 
       '\tconsole.log("Hello world!");', 
       '}' 
      ].join('\n'), 
      language: 'javascript' 
     }); 
    }); 

    function save() { 
     // how do I get the value/code inside the editor? 
     var value = ""; 
     saveValueSomewhere(value);  
    } 
</script> 
</body> 
</html>

來源

2016-06-28 Kyle Gobel

require.config({ paths: { 'vs': 'monaco-editor/min/vs' }}); 
require(['vs/editor/editor.main'], function() { 
    window.editor = monaco.editor.create(document.getElementById('container'),     { 
     value: [ 
      'function x() {', 
      '\tconsole.log("Hello world!");', 
      '}' 
     ].join('\n'), 
     language: 'javascript' 
    }); 
}); 

function save() { 
    // get the value of the data 
    var value = window.editor.getValue() 
    saveValueSomewhere(value);  
}

來源

2016-06-29 07:01:13

對我來說這window.editor.getValue()沒有工作，但下面的代碼工作。

<div id="container" style="width:950px;height:700px;"></div> 
<script src="./monaco-editor/dev/vs/loader.js"></script> 
<script> 
    require.config({ paths: { 'vs': 'monaco-editor/min/vs' }}); 
    require(['vs/editor/editor.main'], function() { 
     var editor = monaco.editor.create(document.getElementById('container'), { 
      value: [ 
       'print "Hello World!"', 
       '# python' 
      ].join('\n'), 
      language: 'python', 
      theme: "vs-dark" 
     }); 

     function saveI() 
     { 
      getVal = editor.getValue() 
      // get the value of the data 
      alert(getVal) 
     } 
     document.getElementById('container').onclick = saveI; 

    }); 
    // Themes: vs-dark , hc-black 
    // language: text/html , javascript 
</script>

你可以改變「集裝箱」你「htmlButton」，然後通過在saveI()功能使用jQuery AJAX保存代碼。

來源

2017-08-15 07:10:43 cyera

無論是編輯器和模型的支持越來越內容：

所以只要你保持到編輯器或模型，你可以查詢內容的參考：

var editor = monaco.editor.create(...); 
var text = editor.getValue();

或者在型號：

var model = monaco.editor.createModel(...); 
var text = model.getValue();

如果有差異的編輯器不能直接訪問該文本上編輯，但你可以在個別車型訪問它們（即通過IStandaloneDiffEditor.getModel()）：

var diffEditor = monaco.editor.createDiffEditor(...); 
var originalText = diffEditor.getModel().original.getValue(); 
var modifiedText = diffEditor.getModel().modified.getValue();

，或通過不同的編輯器（getModifiedEditor()和getOriginalEditor()）：

var originalText = diffEditor.getModifiedEditor().getValue(); 
var modifiedText = diffEditor.getOriginalEditor().getValue();

萬一你感興趣的文本的一部分，該機型還支持getValueInRange()它給出了指定範圍內的文本，由開始和結束列以及行號分隔，例如：

var editor = monaco.editor.create(...); 
var model = editor.getModel(); 
var partOfTheText = model.getValueInRange({ 
    startLineNumber: 1, 
    startColumn: 2, 

    endLineNumber: 3, 
    endColumn: 10, 
})

來源

2018-02-15 22:20:47 MSeifert

獲取摩納哥編輯器的價值

回答

相關問題