JSFiddle - React, Tailwind, and code Playground

by spechackers

HTML

<div ng-app="dr" ng-controller="testCtrl">
    <test color1="color1" data-method="ctrlFn(key)"></test>    
</div>

JavaScript

var app = angular.module('dr', []);
app.controller("testCtrl", function($scope) {
    //Way One
    $scope.ctrlFn = function(arg) {        
        alert("Ctrl Fn Called:  " + arg);
    }
    //Way Two
    $scope.$on('notification', function(evt, value){
        alert("Emit/Broadcat Called : " + value); 
    });   
    
});
app.directive('test', function() {
    return {
        restrict: 'E',
        scope: {
            color1: '=',
            vinothFn: '&method'
        },
        link: function(scope, elm, attrs) {            
            scope.hello = "Vinoth calling from directive";
            //Way One
            scope.vinothFn({key: scope.hello});
            //Way Two
            scope.$emit('notification', scope.hello);
        }
    }
});