JSFiddle - React, Tailwind, and code Playground

by roytruelove

HTML

<div ng-app="myApp">
    <div foo prop1="asdf"></div>
</div>

JavaScript

angular.module("myApp", [])
    .directive("foo", function ($log, $timeout) {
        return {
            restrict: 'A',
            scope: {
                prop1: '@'
            },
            template: '<div ng-click="doStuff()">Hello World -- {{prop1}} -- </div>',
            replace: true,
            link: function(scope, element, attrs) {
                $log.info("prop1 link: " + scope.prop1);
                scope.$watch('prop1', function(oldV, newV) {                    
                    $log.info('prop1 watch: ' + scope.prop1)      
                })                       
                $log.info('prop1 attrs: ' + attrs.prop1)
                $timeout(function() { 
                    $log.info("prop1 timeout: " + scope.prop1);
                }, 0);
                
                scope.doStuff = function() {
                    $log.info("prop1 click: " + scope.prop1);
                }
            }
        };
    });