javascript - Inserting text at Current Cursor position in Textarea Using AngularJs Ng-Click -

we trying implement below requirement. click of button text generated , added textarea. button using ng-onclick.

button code below.

<input type="submit" value="add form" class="btn btn-primary" ng-click="addtoformid($index)" /> 

but many buttons there if adding 4 components 4 buttons there generate formula.

and here textarea code:

 <textarea id="summarformula" ng-model=".summarisation" ng-change="setsummarisationformuladynamic()" cols="100" rows="4"></textarea> 

and here script.

    $scope.addtoformid = function(index){         if( $scope.vm.summarisationform==null)         {             $scope.vm.summarisationform ="["+ $scope.vm.dependencies[index].nename+":{"+$scope.vm.dependencies[index].dbid+","+$scope.vm.dependencies[index].versionid+"}]";          }else             $scope.vm.summarisation+="["+ $scope.vm.dependencies[index].name+":{"+$scope.vm.dependencies[index].id+","+$scope.vm.dependencies[index].versionid+"}]";         $scope.setsummarisationformdynamic();     } 

we can see in else part $scope.vm.summarisationform += + next formula previous 1 wants modify 1 , needs add content keeping cursor.

now ever clicking adding end of content , if entering enter key keeping cursor first line of next line adding same line text there wants find cursor position , insert text keeping cursor or entering enter key position.

i new angular js please me basic idea button how can implement , script modification how can it.?

edit : asp.net mvc5 applicaiton.

if need further more details please let me know.

thanks in advance all.

here hero issues resolved. ever great solved problem.

and done created directive element mentioned in link , called directive in view .

boom worked.

http://plnkr.co/edit/xx1shwqi2t6ji31coneo?p=preview

 app.directive('mytext', ['$rootscope', function($rootscope) {  return {  link: function(scope, element, attrs) {   $rootscope.$on('add', function(e, val) {     var domelement = element[0];      if (document.selection) {       domelement.focus();       var sel = document.selection.createrange();       sel.text = val;       domelement.focus();     } else if (domelement.selectionstart || domelement.selectionstart === 0)           {       var startpos = domelement.selectionstart;       var endpos = domelement.selectionend;       var scrolltop = domelement.scrolltop;       domelement.value = domelement.value.substring(0, startpos) + val +        domelement.value.substring(endpos, domelement.value.length);       domelement.focus();       domelement.selectionstart = startpos + val.length;       domelement.selectionend = startpos + val.length;       domelement.scrolltop = scrolltop;     } else {       domelement.value += val;       domelement.focus();     }    });  } } }]) 

view calling this,

directive name , mytext.