Demonstration that Comment Based Directives get skipped if they are in the <head> section.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!doctype html> | |
| <html> | |
| <head> | |
| <!-- directive: head-comment-directive --> | |
| <element-directive></element-directive> | |
| </head> | |
| <body ng-app="angularHeadApp"> | |
| <!-- directive: body-comment-directive --> | |
| Head Comment Parent Node: {{headCommentParentName}}<br /> | |
| Body Comment Parent Node: {{bodyCommentParentName}}<br /> | |
| Element Parent Node: {{elementParentName}} | |
| <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.9/angular.js"></script> | |
| <script> | |
| angular.module('angularHeadApp', []) | |
| .directive('headCommentDirective', function ($log) { | |
| return { | |
| restrict: 'M', | |
| link: function postLink(scope, element, attrs) { | |
| $log.info("I'm in the head comment directive"); | |
| // | |
| // Report back on what the parent element name is: | |
| // | |
| if(element && element[0] && element[0].parentElement) { | |
| scope.headCommentParentName = element[0].parentElement.nodeName.toLowerCase(); | |
| } | |
| } | |
| }; | |
| }) | |
| .directive('bodyCommentDirective', function ($log) { | |
| return { | |
| restrict: 'M', | |
| link: function postLink(scope, element, attrs) { | |
| $log.info("I'm in the body comment directive"); | |
| // | |
| // Report back on what the parent element name is: | |
| // | |
| if(element && element[0] && element[0].parentElement) { | |
| scope.bodyCommentParentName = element[0].parentElement.nodeName.toLowerCase(); | |
| } | |
| } | |
| }; | |
| }) | |
| .directive('elementDirective', function($log) { | |
| return { | |
| restrict: 'E', | |
| link: function(scope, element, attrs) { | |
| $log.info("I'm in the element directive"); | |
| // | |
| // Report back on what the parent element name is: | |
| // | |
| if(element && element[0] && element[0].parentElement) { | |
| scope.elementParentName = element[0].parentElement.nodeName.toLowerCase(); | |
| } | |
| } | |
| } | |
| }); | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment