我怎样才能加载多个王牌编辑会话，而不会多工作要求

我有下面的代码基本上载入了三个JavaScript的王牌编辑会话：我怎样才能加载多个王牌编辑会话，而不会多工作要求

但问题是，对于每一个会话它创造了新的工人的JavaScript。 js网络请求相同模式。我应该在单个页面上编辑10到30个JavaScript ace编辑器会话，以便在不同的地方用JavaScript编写不同的函数，所以这会消耗内存，让我的Chrome浏览器崩溃，因为它每次都要求工作人员相同的模式。

以下是我的示例HTML文件：（用角形应用）

<!DOCTYPE <!DOCTYPE html> 
 
<html ng-app="editorApp"> 
 
<head> 
 
    <title>Ace editor tst</title> 
 
    <script type="text/javascript" src="bower_components/angular/angular.js"></script> 
 
    <script type="text/javascript" src="bower_components/ace-builds/src/ace.js"></script> 
 
    <script type="text/javascript" src="bower_components/angular-ui-ace/ui-ace.js"></script> 
 
    <script type="text/javascript" src="bower_components/ace-builds/src/ext-language_tools.js"></script> 
 
    <script type="text/javascript" src="index.js"></script> 
 
    <style type="text/css"> 
 
    .e1 { height: 200px; margin-bottom: 5px;} 
 
    .e2 { height: 200px; margin-bottom: 5px;} 
 
    .e3 { height: 200px; margin-bottom: 5px;} 
 
    </style> 
 
</head> 
 
<body ng-controller="appCtrl"> 
 
    <div class="e1" ui-ace="{ 
 
    workerPath: 'bower_components/ace-builds/src-min-noconflict/', 
 
    useWrapMode : true, 
 
    showGutter: true, 
 
    theme:'twilight', 
 
    firstLineNumber: 1, 
 
    onLoad: aceLoaded, 
 
    onChange: aceChanged, 
 
    require: ['ace/ext/language_tools'], 
 
    advanced: { 
 
    enableSnippets: true, 
 
    enableBasicAutocompletion: true, 
 
    enableLiveAutocompletion: true 
 
} 
 
}"></div> 
 
<div class="e2" ui-ace="{ 
 
workerPath: 'bower_components/ace-builds/src-min-noconflict/', 
 
useWrapMode : true, 
 
showGutter: true, 
 
theme:'twilight', 
 
firstLineNumber: 1, 
 
onLoad: aceLoaded, 
 
onChange: aceChanged, 
 
require: ['ace/ext/language_tools'], 
 
advanced: { 
 
enableSnippets: true, 
 
enableBasicAutocompletion: true, 
 
enableLiveAutocompletion: true 
 
} 
 
}"></div> 
 
<div class="e3" ui-ace="{ 
 
workerPath: 'bower_components/ace-builds/src-min-noconflict/', 
 
useWrapMode : true, 
 
showGutter: true, 
 
theme:'twilight', 
 
firstLineNumber: 1, 
 
onLoad: aceLoaded, 
 
onChange: aceChanged, 
 
require: ['ace/ext/language_tools'], 
 
advanced: { 
 
enableSnippets: true, 
 
enableBasicAutocompletion: true, 
 
enableLiveAutocompletion: true 
 
} 
 
}"></div> 
 
</body> 
 
</html>

以下是我的控制器：（index.js）

var app = angular.module('editorApp', ['ui.ace']); 
 
app.controller('appCtrl', function($scope){ 
 
    $scope.aceLoaded = function(_editor){ 
 
     var _session = _editor.getSession(); 
 
     _session.setMode('ace/mode/javascript'); 
 
     var _renderer = _editor.renderer; 
 
     _editor.$blockScrolling = Infinity; 
 
    } 
 

 
/* $scope.acesession = ""; 
 
    $scope.aceLoaded = function(_editor){ 
 
     var _session = ""; 
 
     if(!$scope.acesession) { 
 
      _session = _editor.getSession(); 
 
      _session.setMode('ace/mode/javascript'); 
 
      $scope.acesession = _session; 
 
     } 
 
     else { 
 
      _session = $scope.acesession; 
 
     } 
 

 
     var _renderer = _editor.renderer; 
 
     _editor.$blockScrolling = Infinity; 
 
    }*/ 
 
});

我甚至用https://github.com/ajaxorg/ace/issues/344上讨论过的同一个会话（上面的注释代码）尝试过，但没有奏效。

任何帮助，将不胜感激。

Plnkr在这里http://plnkr.co/edit/lJUAW9EXsiC7RVuga9ia

来源

2015-10-17 Som

试试这个。

更新编辑器会话以仅将工作人员用于活动ace编辑器。

_editor.on('focus', function() { 
    _editor.getSession().setUseWorker(true); 
}); 

_editor.on('blur', function() { 
    _editor.getSession().setUseWorker(false); 
}); 
var _session = _editor.getSession(); 
_session.setUseWorker(false); 
_session.setMode('ace/mode/javascript'); 
var _renderer = _editor.renderer; 
_editor.$blockScrolling = Infinity;

工作Plnkr：http://plnkr.co/edit/B1fuFguofn8cwiUEFnyp?p=preview

来源

2015-10-17 14:59:25

我怎样才能加载多个王牌编辑会话，而不会多工作要求

回答

相关问题