Simple Transclusion Example

HTML

<script src="https://code.angularjs.org/1.3.1/angular.js"></script>
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<body ng-app="transcludeExample">
    
    <div class="container" ng-controller="ParentController">
        <navigation-bar>
            <button class="btn btn-primary" ng-click="button1Click()">{{button1Label}}</button>
            <button class="btn btn-success">Button2</button>
            <button class="btn btn-danger">Button3</button>
        </navigation-bar>
    </div>
</body>

JavaScript

angular.module('transcludeExample', [])

    .controller('ParentController', function ($scope, $window) {
    $scope.button1Label = 'Button1';
    $scope.button1Click = function () {
        $window.alert('Button1 clicked');
    };
})

    .directive('navigationBar', function () {
    return {
        restrict: 'E',
        template: '<div>Navigation Bar<div class="pull-right" ng-transclude></div></div>',
        transclude: false
    };
});