如何在Ace编辑器中显示文件内容

Question

我正在测试ace-editor显示服务器上的大型文本文件。由于它吹嘘能够处理高达4百万行的文件，并且具有文本高亮显示功能，这使它成为一个很好的候选者。

我一直在努力理解Ace Editor的文档和EditSession。根据我的理解，它可以告诉ace editor从一个文件中读取并显示它。

我正在使用createEditSessiont（）创建会话并指定文档。在api文档中：

createEditSession（文档字符串文本、TextMode模式）

文档：必填项。如果text是文档，则会将EditSession与其关联。否则，将创建一个具有初始文本的新文档

下面是我的代码：

<script src="../src/ace.js"></script>
<script>
    var docSession = new ace.createEditSession("../Files/myFile.log", "ace/mode/plain_text");

    var editor = ace.edit("editor");
    editor.setSession(docSession);
    editor.setTheme("ace/theme/dawn");
</script>

null

不幸的是，页面上出现的都是“../files/myfile.log”。我猜它是用那个文本创建另一个文件，而不是读取一个文档。如何正确地告诉它显示myfile.log的内容？

Answer 1

您不必使用ajax调用，这取决于您的应用程序。要玩Ace,你可以这样做：

<?php
   $s = file_get_contents('foo.php');
?>
<div id="editor"></div>
<script>
    var s = '<?= $s ?>';

    var editor = ace.edit("editor");
    editor.session.setMode('php');
    editor.session.setValue(s);
</script>

注意，您可以将元素id或元素传递给ace.edit。

可以使用setValue（）显示任何字符串内容

Answer 2

Ace不以任何方式处理文件，它只是编辑器的前端组件。
createEditSessions定义中的文档是Ace文档对象的实例，而不是文件。
要将文件加载到Ace中，您需要通过ajax调用从服务器获取其内容。类似https://github.com/ajaxorg/ace/blob/v1.1.7/demo/kitchenter-sink/doclist.js#L164