JSFiddle - React, Tailwind, and code Playground

by dkrotts

HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<!doctype html>
<html>
    <head></head>
<body ng-controller="foo">
    <input type="text" my-directive ng-model="bar" /> 
</body>
</html>

JavaScript

var myApp = angular.module('myApp', []);
angular.element(document).ready(function() {
   angular.bootstrap(document, ['myApp']);
});

function foo($scope, $timeout) {
  $scope.bar = "Lorem ipsum";
  
  $timeout(function() {
    $scope.bar = "Dolor sit amet";
  }, 2000);
}

myApp.directive('myDirective', function() {
    return {
        restrict: 'A',
        require: '?ngModel',
        link: function (scope, element, attrs, controller) {
            scope.$watch(controller.$viewValue, function() {
            	console.log("Changed to " + controller.$viewValue);
            });
        }
    }
});