JSFiddle - React, Tailwind, and code Playground

by jrab227

HTML

<div ng-app="coolApp">
    
    <div ng-controller="testController">
        
        <temp-Output
            binder-Variable="data" 
            binder="data"
            different="data"></temp-Output>
        
    </div>
    
</div>

JavaScript

angular.module('controllers', [])
.controller('testController', ['$scope', function($scope){
   $scope.data = true; 
}]);

angular.module('directives', [])
.directive('tempOutput', [function(){
   return {
      restrict: 'E',
       template: 'CamelCase Broken? <h2>{{negation}}</h2>'
       + 'LowercaseSameName Broken? <h2>{{negation2}}</h2>'
        + 'DifferentLowercase Broken? <h2>{{negation3}}</h2>',
       scope: {
           binderVariable: '=binderVariable',
           binder: '=binder',
           different: '=different'
       },
       link: function(scope){
           scope.negation = (scope.binderVariable == true)? false : true
           scope.negation2 = (scope.binder == true)? false : true
           scope.negation3 = (scope.different == true)? false : true
       }
    }; 
}]);

angular.module('coolApp', ['controllers', 'directives']);