2017-03-23 16 views
0

私は私のスニペットは、基本的な自動補完での作業を取得するために管理している:それは言うスニペットのドキュメントでどのようにエースエディタでスニペットのメニューを作るには?

ace.define("ace/snippets/bosun",["require","exports","module"], function(require, exports, module) { 

exports.snippets = [ 
    /* Sections */ 
    { 
     name: "alert definition", 
     tabTrigger: "alertdef", 
     content: 
"alert ${1:alertname} {\n\ 
    warn =\n\ 
}\n" 
    }, 
    { 
     name: "template def", 
     tabTrigger: "templatedef", 
     content: 
"template ${1:templatename} {\n\ 
    subject =\n\ 
}\n" 
    }, 

    /* Funcs */ 
    { 
     name: "avg reduction function", 
     tabTrigger: "avg", 
     content: "avg(${1:seriesSet})" 
    } 
] 

exports.scope = "bosun"; 

}); 

あなたは にそれを設定することができ、メニューやコマンドを通じてスニペットをトリガする場合 得られたコードにスニペットを挿入する前に、選択されたテキストを使用します。

しかし、スニペットを一覧表示するメニューを作成する方法についてはっきりしないのですか? (理想的にはスニペットのカテゴリごとにサブメニューを持つメニューが、最初にクロールして幸せ...)

答えて

0

は、おそらく誰かがより良い方法があります。動作しているようです

$scope.aceLoaded = function (_editor) { 
    editor = _editor; 
    $scope.editor = editor; 
    editor.$blockScrolling = Infinity; 
    editor.focus(); 
    editor.getSession().setUseWrapMode(true); 
    $scope.snippetManager = ace.require("ace/snippets").snippetManager; 
    $scope.bosunSnippets = $scope.snippetManager.snippetNameMap["bosun"]; 
    editor.on("blur", function() { 
     $scope.$apply(function() { 
      $scope.items = parseItems(); 
     }); 
    }); 
}; 

$scope.listSnippets = function() { 
    var snips = $scope.snippetManager.snippetNameMap["bosun"]; 
    if (snips) { 
     return Object.keys(snips) 
    } 
    return {}; 
} 

$scope.insertSnippet = function(snippetName) { 
    $scope.snippetManager.insertSnippetForSelection($scope.editor, $scope.snippetManager.snippetNameMap["bosun"][snippetName].content); 
    $scope.editor.focus(); 
    $scope.editor.tabstopManager.tabNext() 
} 

は、おそらくより良い方法があります:しかしhttps://github.com/ajaxorg/ace/blob/master/lib/ace/snippets.jsでコードを読んでから、私が出ています。

関連する問題