Posts

Tutorial 12.9 Creating a Directive that Manipulates the DOM

-
******************************************INDEX.HTML***************************************************** <!doctype html> <html lang="en"> <head>   <meta charset="UTF-8">   <title>Example - example-directive-link-production</title>     <script src="//code.angularjs.org/snapshot/angular.min.js"></script>   <script src="script.js"></script>     </head> <body ng-app="docsTimeDirective">   <div ng-controller="Controller">   Date format: <input ng-model="format"> <hr/>   Current time is: <span my-current-time="format"></span> </div> </body> </html> ******************************************INDEX.HTML***************************************************** ********************************************script.js*************************************************** ((function(angu...
Post a Comment
Read more

Tutorial 12.8 Isolating the Scope of a Directive 3

-
******************************************INDEX.HTML***************************************************** <!doctype html> <html lang="en"> <head>   <meta charset="UTF-8">   <title>Example - example-directive-isolate-2-production</title>     <script src="//code.angularjs.org/snapshot/angular.min.js"></script>   <script src="script.js"></script>     </head> <body ng-app="docsIsolationExample">   <div ng-controller="Controller">   <my-customer info="naomi"></my-customer> </div> </body> </html> ******************************************INDEX.HTML***************************************************** ********************************************script.js*************************************************** (function(angular) {   'use strict'; angular.module('docsIsolationExample...
Post a Comment
Read more

Tutorial 12.7 Isolating the Scope of a Directive 2

-
******************************************INDEX.HTML***************************************************** <!doctype html> <html lang="en"> <head>   <meta charset="UTF-8">   <title>Example - example-directive-isolate-production</title>     <script src="//code.angularjs.org/snapshot/angular.min.js"></script>   <script src="script.js"></script>     </head> <body ng-app="docsIsolateScopeDirective">   <div ng-controller="Controller">   <my-customer info="naomi"></my-customer>   <hr>   <my-customer info="igor"></my-customer> </div> </body> </html> ******************************************INDEX.HTML***************************************************** ********************************************script.js*************************************************** (function...
Post a Comment
Read more

Tutorial 12.6 Isolating the Scope of a Directive 1

-
******************************************INDEX.HTML***************************************************** <!doctype html> <html lang="en"> <head>   <meta charset="UTF-8">   <title>Example - example-directive-scope-problem-production</title>     <script src="//code.angularjs.org/snapshot/angular.min.js"></script>   <script src="script.js"></script>     </head> <body ng-app="docsScopeProblemExample">   <div ng-controller="NaomiController">   <my-customer></my-customer> </div> <hr> <div ng-controller="IgorController">   <my-customer></my-customer> </div> </body> </html> ******************************************INDEX.HTML***************************************************** ********************************************script.js********************************...
Post a Comment
Read more

Tutorial 12.5 Template-expanding directive 1

-
******************************************INDEX.HTML***************************************************** <!doctype html> <html lang="en"> <head>   <meta charset="UTF-8">   <title>Example - example-directive-restrict-production</title>     <script src="//code.angularjs.org/snapshot/angular.min.js"></script>   <script src="script.js"></script>     </head> <body ng-app="docsRestrictDirective">   <div ng-controller="Controller">   <my-customer></my-customer> </div> </body> </html> ******************************************INDEX.HTML***************************************************** ********************************************script.js*************************************************** (function(angular) {   'use strict'; angular.module('docsRestrictDirective', [])   .controller(...
Post a Comment
Read more

Tutorial 12.4 Template-expanding directive 3 restrict option

-
******************************************INDEX.HTML*************************** <!doctype html> <html lang="en"> <head>   <meta charset="UTF-8">   <title>Example - example-directive-template-url-fn-production</title>     <script src="//code.angularjs.org/snapshot/angular.min.js"></script>   <script src="script.js"></script>     </head> <body ng-app="docsTemplateUrlDirective">   <div ng-controller="Controller">   <div my-customer type="name"></div>   <div my-customer type="address"></div> </div> </body> </html> ******************************************INDEX.HTML***************************************************** ********************************************script.js*************************************************** angular.module('docsTemplateUrlDirective'...
Post a Comment
Read more

Tutorial 12.3 Template-expanding directive 2 templateUrl

-
******************************************INDEX.HTML***************************************************** <!doctype html> <html lang="en"> <head>   <meta charset="UTF-8">   <title>Example - example-directive-template-url-production</title>     <script src="//code.angularjs.org/snapshot/angular.min.js"></script>   <script src="script.js"></script>     </head> <body ng-app="docsTemplateUrlDirective">   <div ng-controller="Controller">   <div my-customer></div> </div> </body> </html> ******************************************INDEX.HTML***************************************************** ********************************************script.js*************************************************** (function(angular) {   'use strict'; angular.module('docsTemplateUrlDirective', [])   .contr...
Post a Comment
Read more