CodeMirror danh sách gợi ý tùy chỉnh không hoạt động đúng cách

Question

Tôi đang cố gắng móc vào CodeMirror và cắm danh sách các từ riêng của mình để xuất hiện trong tự động hoàn thành. Dựa trên liên kết này https://stackoverflow.com/a/19269913/2892746 Tôi đã cố thực hiện những điều sau đây. Tôi đã tạo một JSBin with it

Vấn đề là trong khi từ của tôi xuất hiện trong tự động hoàn thành, chúng không được lọc chính xác. Ví dụ, tôi gõ "f", và sau đó tôi làm ctrl + không gian. Nhưng tôi nhận được tất cả 3 từ trong cửa sổ bật lên với "mariano" được chọn. Tôi hy vọng sẽ chỉ có "Florencia" có sẵn và được chọn.

Bất kỳ ý tưởng nào tôi có thể làm sai?

ps: vâng, tôi rất muốn không thay đổi anyword gợi ý và cung cấp gợi ý của riêng tôi mà chỉ đơn giản là phù hợp với từ của riêng tôi, nhưng tôi không biết làm thế nào để làm điều đó.

Cảm ơn trước !!

Answer 1

Cuối cùng tôi đã tự giải quyết vấn đề này. Tôi không phải là chuyên gia JS, nhưng tôi chia sẻ giải pháp của mình trong trường hợp nó hữu ích cho người khác.

QUAN TRỌNG: Tôi nhận mã gốc từ this project. Dự án đó là với sự phụ thuộc của Angular và Angular-codemirror. Tôi đã không sử dụng góc bất cứ nơi nào trong ứng dụng của tôi vì vậy tôi trích xuất và điều chỉnh nó để sử dụng nó mà không có góc.

Mục đích là để có thể xác định từ điển/bản đồ các từ sẽ được sử dụng cho tự động hoàn thành. Giải pháp này rất đơn giản. Tại một phụ huynh của myTextAreaId yếu tố bạn phải tạo một khoảng/div như thế này:

<div class="codeMirrorDictionaryHintDiv" codemirror-dictionary-hint="[ 'Soccer', 'Cricket', 'Baseball', 'Kho Kho' ]"></div> 

Sau đó ... mã, sẽ tra cứu các yếu tố closest với lớp css codeMirrorDictionaryHintDiv, sẽ trích xuất các thuộc tính codemirror-dictionary-hint, sẽ đánh giá rằng trong để lấy một mảng Javascript ra khỏi nó, và sau đó chỉ cần thiết lập đó làm từ điển đầu vào cho hàm gợi ý.

Mã này là:

var dictionary = []; 

var dictionary = eval($('#myTextAreaId').closest('.codeMirrorDictionaryHintDiv').attr('codemirror-dictionary-hint')); 
if (dictionary == null) { 
    dictionary = []; 
}; 


// Register our custom Codemirror hint plugin. 
CodeMirror.registerHelper('hint', 'dictionaryHint', function(editor) { 
    var cur = editor.getCursor(), 
     curLine = editor.getLine(cur.line); 
    var start = cur.ch, 
     end = start; 
    while (end < curLine.length && /[\w$]+/.test(curLine.charAt(end))) ++end; 
    while (start && /[\w$]+/.test(curLine.charAt(start - 1))) --start; 
    var curWord = start != end && curLine.slice(start, end); 
    var regex = new RegExp('^' + curWord, 'i'); 
    return { 
     list: (!curWord ? [] : dictionary.filter(function(item) { 
      return item.match(regex); 
     })).sort(), 
     from: CodeMirror.Pos(cur.line, start), 
     to: CodeMirror.Pos(cur.line, end) 
    } 
}); 

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