JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.angularjs.org/1.4.9/angular.min.js"></script>
<div ng-controller="MyController">
  {{ page }}
  <div my-directive page="page"></div>
</div>

JavaScript

angular.module('app', [])
.controller('MyController', function($scope) {
	$scope.page = 'not changed';
})
.directive('myDirective', function() {
	return {
  	scope: {
    	page: '='
    },
    template: '<button ng-click="test()">click me to change the page</button>',
    controller: function($scope) {
    	$scope.test = function() {
      	$scope.page = 'changed from directive';
      }
    }
  };
});