16

我对代码镜像中的自动完成功能有点困难。我想做的是两件事(我都在努力):

1) 我想为HTML和启用自动完成JavaScript。目前,我一次只能使用例如:

 CodeMirror.commands.autocomplete = function (cm) {
     CodeMirror.showHint(cm, CodeMirror.hint.html);
 };

如何CodeMirror.hint.javascript从一个添加到列表中HTML

2)(更重要的) ——如何将自定义变量添加到HTML从 ajax 调用中检索到的区域的提示列表中.....

即我想让下拉列表显示来自 html 提示的当前数据列表,然后添加自定义条目,例如##SomeCode1####SomeCode2##

我这里有两个问题。首先,当我尝试对 'html-hint.js' 文件中的值进行硬编码时,所有值都附加了<... 这不是我想要的。

第二个问题是我相信我必须编写一个新的 'html-hint.js' 文件对吗?我的意思是没有办法在CodeMirror.hint.html上面的'options'参数中传递任何东西,基本上合并两个列表。

我来宾一和二想起来有点相似……将两个自动完成的值列表合并在一起。

我猜框架中什么都没有,我必须编写一个自定义提示文件,对吗?

任何指针将不胜感激。示例代码会很棒。

4

3 回答 3

22

如果您未指定提示函数,则 show-hint 插件将采用为完成发生的本地模式定义的提示帮助函数,因此它将CodeMirror.hint.javascriptJavaScript代码和CodeMirror.hint.htmlHTML 中。

如果您需要添加自己的完成逻辑,您可以通过简单地用您自己的代码覆盖它们来替换(或包装)这些函数。

这是一个粗略的 hack 示例,它总是在 JavaScript 完成中添加“bozo”:

var orig = CodeMirror.hint.javascript;
CodeMirror.hint.javascript = function(cm) {
  var inner = orig(cm) || {from: cm.getCursor(), to: cm.getCursor(), list: []};
  inner.list.push("bozo");
  return inner;
};
于 2013-10-09T10:47:31.533 回答
9

感谢@Marjin 的简要解释,但由于它不包括过滤并且很多人需要它,这就是我按照 Marjin 的回答在mongoclient中所做的。并从这里部分获得帮助

ps不要忘记用你的改变提示,因为我使用的是javascript,所以我已经改变了javascript提示。

CodeMirror.hint.javascript = function (editor) {
        var list = Session.get(Template.strSessionDistinctFields) || [];
        var cursor = editor.getCursor();
        var currentLine = editor.getLine(cursor.line);
        var start = cursor.ch;
        var end = start;
        while (end < currentLine.length && /[\w$]+/.test(currentLine.charAt(end))) ++end;
        while (start && /[\w$]+/.test(currentLine.charAt(start - 1))) --start;
        var curWord = start != end && currentLine.slice(start, end);
        var regex = new RegExp('^' + curWord, 'i');
        var result = {
            list: (!curWord ? list : list.filter(function (item) {
                return item.match(regex);
            })).sort(),
            from: CodeMirror.Pos(cursor.line, start),
            to: CodeMirror.Pos(cursor.line, end)
        };

        return result;
    };
于 2016-10-11T08:21:42.240 回答
0

如果它对某人有帮助,这是一个结合了@Marjin 和 Sercan 的部分的版本。它使用默认提示,并添加了我们的附加功能。

const hintWords=["trap.our()", "trap.hints()", "trap"]; // custom hints
const jsHinter = CodeMirror.hint.javascript; // copy default hinter for JavaScript
CodeMirror.hint.javascript = function (editor) {
    // Find the word fragment near cursor that needs auto-complete...
    const cursor = editor.getCursor();
    const currentLine = editor.getLine(cursor.line);
    let start = cursor.ch;
    let end = start;
    const rex=/[\w.]/; // a pattern to match any characters in our hint "words"
    // Our hints include function calls, e.g. "trap.getSource()"
    // so we search for word charcters (\w) and periods.
    // First (and optional), find end of current "word" at cursor...
    while (end < currentLine.length && rex.test(currentLine.charAt(end))) ++end;
    // Find beginning of current "word" at cursor...
    while (start && rex.test(currentLine.charAt(start - 1))) --start;
    // Grab the current word, if any...
    const curWord = start !== end && currentLine.slice(start, end);
    // Get the default results object from the JavaScript hinter...
    const dflt=jsHinter(editor);
    // If the default hinter didn't hint, create a blank result for now...
    const result = dflt || {list: []};
    // Set the start/end of the replacement range...
    result.to=CodeMirror.Pos(cursor.line, end);
    result.from=CodeMirror.Pos(cursor.line, start);
    // Add our custom hintWords to the list, if they start with the curWord...
    hintWords.forEach(h=>{if (h.startsWith(curWord)) result.list.push(h);});
    result.list.sort(); // sort the final list of hints
    return result;
};
于 2021-03-12T18:05:38.773 回答