JSFiddle - React, Tailwind, and code Playground

HTML

<div ng-app="app" ng-controller="MainCtrl">
    <textarea x2 ng-model="nr">{{nr}}</textarea>
    <div id ="watch"></div>
</div>

CSS

textarea {resize:none}

JavaScript

angular.module('app', [])
    .controller('MainCtrl', function($scope) {
        $scope.nr = 1;
    })
.directive('x2', function(){
        return {
            restrict: 'A',
            link: function (scope, element, attrs) {
                element.bind('blur', function (e) {
                    scope.$apply(function () {
                        scope.nr = scope.nr * 2;
                    });
                    
                    document.getElementById('watch').innerHTML = scope.nr;

                });

            }
        };
  });