Ace 编辑器自动完成上传额外记录

Question

我使用 angular 在我的应用程序中添加了 ui-ace 编辑器。在申请启动期间，我没有每次都请求单词，而是 json 1 次。

json-文件示例：

[
  {
    "Word": "Do {int} + {int}",
    "Meta": "Implemented"
  },
  {
    "Word": "Line3",
    "Meta": "Not-implemented"
  },
  {
    "Word": "Line2",
    "Meta": "Not-implemented"
  },
  {
    "Word": "Line4",
    "Meta": "Not-implemented"
  },
  {
    "Word": "444",
    "Meta": "Not-implemented"
  },
  {
    "Word": "E1",
    "Meta": "Not-implemented"
  },
  {
    "Word": "E2",
    "Meta": "Not-implemented"
  },
  {
    "Word": "E1Try",
    "Meta": "Not-implemented"
  },
  {
    "Word": "E3",
    "Meta": "Not-implemented"
  },
  {
    "Word": "E4444",
    "Meta": "Not-implemented"
  }
]

问题是有些词在自动完成中列出的比一个多，请看截图：http://take.ms/N8BFZ。这是我加载 ace-editor 的方式，其中 ctrl.listStepLines 是一个对象，其中包含 json-来自 API 的响应：

$scope.aceLoaded = function(_editor){
    // Editor part
    var _session = _editor.getSession();
    var _renderer = _editor.renderer;

    _editor.$blockScrolling = Infinity;
    _editor.setOptions({
        minLines: 10,
        maxLines: 40,
        wrap: true,
        firstLineNumber: 1,
        enableBasicAutocompletion: true,
        enableSnippets: true,
        enableLiveAutocompletion: true
    })

    var langTools = ace.require("ace/ext/language_tools");
    var rhymeCompleter = {
        getCompletions: function (editor, session, pos, prefix, callback) {
            if (prefix.length === 0) { callback(null, []); return }
            callback(null, ctrl.listStepLines.map(function (ea) {
                return { name: ea.Word, value: ea.Word, meta: ea.Meta }
            }));
        }
    }
    langTools.addCompleter(rhymeCompleter);
};

Answer 1

问题是 angularjs 多次加载我的函数，而 ace editor 有 14 个类似的完成器。我重构了我的代码并创建了一个单独的函数来完成添加，它只被调用一次。

ctrl.addAutoCompleter();

        function init() {

            ctrl.addAutoCompleter = function () {
                var langTools = ace.require("ace/ext/language_tools");
                var stepLineCompleter = {
                    getCompletions: function (_editor, session, pos, prefix, callback) {
                        if (prefix.length === 0) { callback(null, []); return }
                        callback(null, ctrl.listStepLines.map(function (ea) {
                            return { name: ea.Word, value: ea.Word, meta: ea.Meta }
                        }));
                    }
                }
                langTools.addCompleter(stepLineCompleter);
            }
};

Ace 编辑器自动完成上传额外记录

Ace editor autocomplete uploads extra-records

ace-editor

angularjs