자동 완성을 위해 codemirror와 함께 사용할 수있는 lib가 있습니까?

Question

나는 codemirror 편집기를 사용하고 있습니다 ... 나는 autocomplete 할 때 appare 목록에있는 항목을 스타일링하는 것과 같은 기능을 원합니다 ... 그래서 libem 또는 codemirror와 함께 사용할 수있는 플러그인이 codemirror보다 많은 기능을 제공합니다. .. 참고 : codemirror가 아닌 codemirror와 함께 사용하고 싶습니다. 미리 감사드립니다.

Answer 1

성공했습니다. 나는 동적으로 hintOptions에 개체로 모든 테이블/열을 추가 내 주요 웹 페이지에서

.table.CodeMirror-hint { 
    font-weight: bold; 
    color: black; 
} 

.column.CodeMirror-hint { 
    font-weight: bold; 
    color: black; 
} 

.keyword.CodeMirror-hint { 
    font-weight: bold; 
    color: #BF00FF; 
} 

.builtin.CodeMirror-hint { 
    font-weight: bold; 
    color: #2E64FE; 
} 

: 쇼 hint.css에서 나는 약간의 CSS를 추가했다. 각 테이블에 대해 나는 다음과 같이 수행

 var tcobjs = []; //table columns array of object 
     for (j=0; j < tablecolumns.length; j++) { 
      tcobjs.push({text:tablecolumns[j],className:"column"}); 
     } 
     hintOptions.tables[table]=tcobjs; 

I 수정 같은 부가 기능/힌트/SQL hint.js :

다르게 개별 항목의 스타일을하는 방법

var keywords; 
    var builtin; 

    function getKeywords(editor) { 
    var mode = editor.doc.modeOption; 
    if (mode === "sql") mode = "text/x-sql"; 
    var words = {}; 
    for (var w in CodeMirror.resolveMode(mode).keywords) { words[w] = CodeMirror.resolveMode(mode).keywords[w]; } 
    return words; 
    } 

    function getBuiltin(editor) { 
    var mode = editor.doc.modeOption; 
    if (mode === "sql") mode = "text/x-sql"; 
    var words = {}; 
    for (var w in CodeMirror.resolveMode(mode).builtin) { words[w] = CodeMirror.resolveMode(mode).builtin[w]; } 
    return words; 
    } 

[....] 

    keywords = getKeywords(editor); 
    builtin = getBuiltin(editor); 

[....] 

     addMatches(result, search, tables, function(w) {return {text:w,className:"table"};}); 
     addMatches(result, search, defaultTable, function(w) {return {text:w,className:"table"};}); 
     if (!disableKeywords) 
     addMatches(result, search, keywords, function(w) {return {text:w.toUpperCase(),className:"keyword"};}); 
     addMatches(result, search, builtin, function(w) {return {text:w.toUpperCase(),className:"builtin"};}); 

Answer 2

예, 자동 완료에는 hint addon을 사용할 수 있습니다. 그리고 addon/hint/show-hint.css을 수정하여 항목 스타일을 지정할 수 있습니다.