问答博客资讯标签用户活动
logo极客观点logo项目管理logoHarmonyOS
开发者社区
javascript
前端
python
node.js
react
vue.js
php
laravel
go
人工智能
mysql
linux
ios
java
android
css
typescript
spring
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

获取摩纳哥编辑器的价值

社区维基
1
新手上路，请多包涵

微软最近开源了他们的 monaco 编辑器（类似于 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>

原文由 Kyle Gobel 发布，翻译遵循 CC BY-SA 4.0 许可协议

Stack Overflow 翻译javascriptmonaco-editor
阅读 608
2 个回答
得票最新
社区维基
1
✓ 已被采纳
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);
}

原文由 Jonathan Ho 发布，翻译遵循 CC BY-SA 3.0 许可协议

社区维基
1

编辑器和模型都支持获取内容：

因此，只要保留对编辑器或模型的引用，就可以查询内容：

 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,
})

原文由 MSeifert 发布，翻译遵循 CC BY-SA 3.0 许可协议

撰写回答
你尚未登录，登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进，让解决方法与时俱进
推荐问题