angular-ui/ui-codemirror

Controller for ui-codemirror directive

rishulmatta opened this issue · 0 comments

My Custom Directive : implements auto complete :-

angular.module('myModule').directive('configValAutoComplete', [ '$templateCache' , '$compile' ,          'dataService', function($templateCache , $compile , dataService) {
  return {
    require: ['ngModel','?uiCodemirror'],
    restrict : 'A',
    link: function(scope, element, attrs, controllerArray) {

      var  ngModelCtrl , codeMirrorCtrl;

      ngModelCtrl = controllerArray[0];
      codeMirrorCtrl = controllerArray[1];  //this is null

   //logic follows

     }
  }]);

My HTML template is :-

<textarea class="form-control" ui-codemirror ui-refresh="true" ui-codemirror-opts="editorOptions" rows="3" placeholder="Your SQL query here" ng-model="query" config-val-auto-complete></textarea>

So I have an above auto complete which I am using across all my input elements .

This directive gets its auto complete list from a service name dataService. Till now i used only ngModelController to update the model values and view when the user selected a value (user can type and also select from auto complete list i.e. selections of autocomplete are appended to the entered input).

Now I want to use ui-codemirror as I am providing some parametes inside a sql query for eg :

Select col1 from table1 where col2 = ${My_Custom_param}$

${My_Custom_param}$ is suggested as an autocomplete. Now with code mirror the problem is that the actual text area is hidden and a new div with all the fancy formatting is put in.

To make my directive complete I need to interact with the controller of uiCodemirror so that on selection i can invoke the appropriate api. But it seems controller for codMirror is not implemented.

Ideally this should be exposed so that integration with every directive is possible.