Angular: Directive Modify Parent Scope

http://angularjs.org/

HTML

<script src="http://code.angularjs.org/angular-1.0.0rc7.js"></script>
<script type="text/ng-template" id="mydirective.html">
<div>
    <div ng-controller="IncludeCtrl">{{data.message}}</div>
    <hr />
    <div ng-include="'myinclude.html'"></div>
</div>         
</script>

<script type="text/ng-template" id="myinclude.html">
 <div ng-controller="NestedIncludeCtrl">
     {{data.message}}
 </div>         
</script>  

<div ng-controller="MyCtrl">
    <input ng-model="data.message">
    <my-element></my-element>
</div>

JavaScript

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

myApp.factory('data', function() {
    return {
        message: 'Hello World'
    };
});

myApp.directive('myElement', function() {
    return {
        restrict: 'E',
        replace: true,
        scope: {},
        templateUrl: 'mydirective.html'
    }
});

function MyCtrl($scope, data) {
    $scope.data = data;
}

function IncludeCtrl($scope, data) {
    $scope.data = data;
}

function NestedIncludeCtrl($scope, data) {
    $scope.data = data;
}