Question

我正在尝试使用ACE Editor在页面上显示代码（JSON响应）。当我在着陆页{@ 1}}上尝试ace示例时，它可以正常工作。但是当我在index.html上使用相同的代码时，它无法正常工作。

HTML

page2.html

SCRIPT：相同的代码适用于index.html但放在其他网页上时无效。

<div id="editor">
  function foo(items) {
   var i;
   for (i = 0; i &lt; items.length; i++) {
     alert("Ace Rocks " + items[i]);
   };
</div>

我甚至尝试将上述js代码放在外部文件var editor = ace.edit("editor"); editor.setTheme("ace/theme/twilight"); editor.getSession().setMode("ace/mode/javascript");上，希望它可以在任何页面上使用。

由于是AngularJS应用程序，<script src-"js/script,js"></script>和其他页面都是通过page2.html

加载的

Answer 1

正如@Michael建议的那样，Ace在加载页面内容之前正在评估var editor = ace.edit("editor")。我不得不在html或外部脚本中使用脚本，而是将脚本代码放在page2.html控制器中....

function page2Ctrl ($scope, $http) {
 var editor = ace.edit("editor");
 editor.setTheme("ace/theme/twilight");
 editor.getSession().setMode("ace/mode/javascript");
}

当应用程序继续page2.html时，页面的ctrl就会启动。

Answer 2

如果你在脚本中有一个函数，那么把它放在 var editor = ace.edit("editor");

editor.setTheme("ace/theme/twilight");
editor.getSession().setMode("ace/mode/javascript");

在同一个函数里面。
你也可以这样做：

   function doOnLoad()
    {
        var editor = ace.edit("editor");
        editor.setTheme("ace/theme/twilight");
        editor.getSession().setMode("ace/mode/javascript");
    }

Ace-editor不在其他页面上工作 - AngularJS App

2 个答案: