ng-transclude

 <!DOCTYPE html>

 <html>

     <head>

         <meta charset="UTF-8">

         <title></title>

         <script src="js/angular/angular.min.js"></script>

     </head>

     <body>

         <div ng-app="testapp" ng-controller="parentController">

             <button-bar>

                 <button class="primary" ng-click="onPrimary1Click()">{{primary1Label}}</button>

                 <button class="primary">Primary2</button>

             </button-bar>

         </div>

         <script>

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

             testapp.controller('parentController', ['$scope', '$window', function($scope, $window) {

                 console.log('parentController scope id = ', $scope.$id);

                 $scope.primary1Label = 'Prime1';

                 $scope.onPrimary1Click = function() {

                     $window.alert('Primary1 clicked');

                 };

             }]);

             testapp.directive('buttonBar', function() {

                 return {

                     restrict: 'EA',

                     template: '<div class="span4 well clearfix"><div class="pull-right" ng-transclude></div></div>',

                     replace: true,

                     transclude: true

                 };

             });

         </script>

     </body>

 </html>
ng-transclude
相关文章
