AngularJS Transclude Scope Test

by Graham Le

HTML

<script src="http://code.angularjs.org/1.0.1/angular-1.0.1.js"></script>
<div ng-controller="MyCtrl">
    <dialog title="Hello {{username}}!">
        Body goes here: {{username}} is {{title}}.
    </dialog>
</div>

JavaScript

var myModule = angular.module('myModule', [])
    .directive('dialog', function () {
        return {
            restrict:'E',
            template:'<div><h3>{{title}}</h3><div ng-transclude></div></div>',
            transclude: true,
            scope:{               
                title:'@'
            }        
        };
    })
    .controller('MyCtrl', ['$scope', function ($scope) {
        $scope.username = 'Gongjie';
        $scope.title = 'Title From Parent';
    }]);