Ace-editor не работает на других страницах - приложение AngularJS

Question

Я пытаюсь использовать редактор ACE для отображения кода (ответ JSON) на странице. Когда я пробую пример туза на целевой странице, index.html, он работает. Но когда я использую тот же код на page2.html, он не будет работать.

HTML

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

SCRIPT: тот же код работает на index.html, но не будут работать при размещении на других страницах.

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

Я даже попытался положить приведенный выше JS код на внешний файл <script src-"js/script,js"></script> с надеждами он будет доступен на любой странице.

Так как сво AngularJS приложение, page2.html и другие страницы загружаются через ngView

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"); 
    }