JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.14/angular.js"></script>
<script src="http://rawgithub.com/acdvorak/jquery.caret/master/dist/jquery.caret-1.5.1.js"></script>
<div ng-app="App" ng-controller="Main">

 <textarea caret caret-position="uiState.caretPosition"></textarea>
   {{uiState.caretPosition}}

</div>

JavaScript

angular.module('App', [])


.controller('Main', ['$scope', function ($scope) {
  $scope.uiState = {};
  $scope.uiState.caretPosition = 0;
}])


.directive('caret', function() {
  return {
    restrict: 'A',
    scope: {caretPosition: '='},
    link: function(scope, element, attrs) {
      var $el = angular.element(element);
      $el.on('keyup', function() {
        scope.caretPosition = $el.caret();
      });
    }
  };
});