In AngularJS, if you want to insert text at current caret position, you can use following service. The code is written in CoffeeScript.

angular  
  .module('text-insert', [])
  .service('TextInsert', () -> 
    {       
      insert: (input, text) ->
        return if !input
        scrollPos = input.scrollTop
        pos = 0
        browser = if (input.selectionStart || input.selectionStart == '0') then 'ff' else (if document.selection then 'ie' else false)
        if browser == 'ie'
          input.focus()
          range = document.selection.createRange()
          range.moveStart('character', -input.value.length)
          pos = range.text.length
        else if browser == 'ff'
          pos = input.selectionStart
        front = (input.value).substring(0, pos)
        back = (input.value).substring(pos, input.value.length)
        input.value = front + text + back
        pos = pos + text.length
        if browser == 'ie'
          input.focus()
          range = document.selection.createRange()
          range.moveStart('character', -input.value.length)
          range.moveStart('character', pos)
          range.moveEnd('character', 0)
          range.select()
        else if browser == 'ff'
          input.selectionStart = pos
          input.selectionEnd = pos
          input.focus()
        input.scrollTop = scrollPos
        angular.element(input).trigger('input')
        ''
    }
  )

The first argument of insert method is the raw DOM node, can be input or textarea. The second argument is the text to insert. See following code about how to use it.

TextInsert.insert(angular.element('#input1')[0], 'hello')  

This AngularJS service is based on another CodePen project.

A complete example can be find in this CodePen project. If you want to use JavaScript, you can click 'View Compiled' in CodePen to see the compiled JavaScript code.

See the Pen Angular Text Insert at Caret Position by Fu Cheng (@alexcheng) on CodePen.