JSFiddle - React, Tailwind, and code Playground

by Vikas

HTML

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.12/angular.min.js"></script>
<div ng-app = 'myApp'>
<div ng-controller = 'myCtrl'>
  {{a}} and {{b}}
  
  <div my-directive>
  </div>
  <div my-directive2>
  </div>
  
  <hr>
</div>
</div>

JavaScript

angular.module('myApp', [])
.controller("myCtrl", function($scope) {
  $scope.a = 55;
  $scope.b = 66;
})
.directive('myDirective', function() {
	return {
		template : '<div>{{a}} and {{b}}</div>',
    controller : function($scope){$scope.a = 77}
	}
}).directive('myDirective2', function() {
	return {
		template : '<div>{{a}} and {{b}}</div>',
    controller : function($scope){$scope.b = 88},
    scope : true;
	}
});