| <!doctype html> |
| <html lang="en"> |
| <head> |
| <meta charset="UTF-8"> |
| <title>Example - example-example48-debug</title> |
| |
| |
| <script src="../../../angular.js"></script> |
| |
| |
| |
| </head> |
| <body ng-app="transclude"> |
| <script> |
| function Ctrl($scope) { |
| $scope.title = 'Lorem Ipsum'; |
| $scope.text = 'Neque porro quisquam est qui dolorem ipsum quia dolor...'; |
| } |
| |
| angular.module('transclude', []) |
| .directive('pane', function(){ |
| return { |
| restrict: 'E', |
| transclude: true, |
| scope: { title:'@' }, |
| template: '<div style="border: 1px solid black;">' + |
| '<div style="background-color: gray">{{title}}</div>' + |
| '<div ng-transclude></div>' + |
| '</div>' |
| }; |
| }); |
| </script> |
| <div ng-controller="Ctrl"> |
| <input ng-model="title"><br> |
| <textarea ng-model="text"></textarea> <br/> |
| <pane title="{{title}}">{{text}}</pane> |
| </div> |
| </body> |
| </html> |