JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.1.1/angular.min.js"></script>
<div ng-app="app">
    <div id="test" ng-controller="test"></div>
    <div random="treeFamily" required-controller="test"></div>
</div>

JavaScript

var app = angular.module('app', []);

app.controller('test', function( $scope ) {
    $scope.treeFamily = 'Hello World';
});

app.directive('random', function() {
    return {
        template: '<h1>{{result}}</h1>',
        link: function( $scope, $element, $attrs) {
            var scope = $('#' + $attrs.requiredController ).scope();
            $scope.result = scope[$attrs.random];
        }
    }
});