docs(guide/forms): update examples to use modules

btford · btford · commit 3ecac6225182 · 2014-07-08T02:32:20.000-07:00
diff --git a/docs/content/guide/forms.ngdoc b/docs/content/guide/forms.ngdoc
@@ -16,9 +16,9 @@ The key directive in understanding two-way data-binding is {@link ng.directive:n
 The `ngModel` directive provides the two-way data-binding by synchronizing the model to the view, as well as view to the model.
 In addition it provides an {@link ngModel.NgModelController API} for other directives to augment its behavior.
 
-<example>
+<example module="formExample">
   <file name="index.html">
-    <div ng-controller="Controller">
+    <div ng-controller="ExampleController">
       <form novalidate class="simple-form">
         Name: <input type="text" ng-model="user.name" /><br />
         E-mail: <input type="email" ng-model="user.email" /><br />
@@ -32,19 +32,20 @@ In addition it provides an {@link ngModel.NgModelController API} for other direc
     </div>
 
     <script>
-      function Controller($scope) {
-        $scope.master = {};
+      angular.module('formExample', [])
+        .controller('ExampleController', ['$scope', function($scope) {
+          $scope.master = {};
 
-        $scope.update = function(user) {
-          $scope.master = angular.copy(user);
-        };
+          $scope.update = function(user) {
+            $scope.master = angular.copy(user);
+          };
 
-        $scope.reset = function() {
-          $scope.user = angular.copy($scope.master);
-        };
+          $scope.reset = function() {
+            $scope.user = angular.copy($scope.master);
+          };
 
-        $scope.reset();
-      }
+          $scope.reset();
+        }]);
     </script>
   </file>
 </example>
@@ -67,9 +68,9 @@ The following example uses the CSS to display validity of each form control.
 In the example both `user.name` and `user.email` are required, but are rendered with red background only when they are dirty.
 This ensures that the user is not distracted with an error until after interacting with the control, and failing to satisfy its validity.
 
-<example>
+<example module="formExample">
   <file name="index.html">
-    <div ng-controller="Controller">
+    <div ng-controller="ExampleController">
       <form novalidate class="css-form">
         Name:
           <input type="text" ng-model="user.name" required /><br />
@@ -92,19 +93,20 @@ This ensures that the user is not distracted with an error until after interacti
     </style>
 
     <script>
-      function Controller($scope) {
-        $scope.master = {};
+      angular.module('formExample', [])
+        .controller('ExampleController', ['$scope', function($scope) {
+          $scope.master = {};
 
-        $scope.update = function(user) {
-          $scope.master = angular.copy(user);
-        };
+          $scope.update = function(user) {
+            $scope.master = angular.copy(user);
+          };
 
-        $scope.reset = function() {
-          $scope.user = angular.copy($scope.master);
-        };
+          $scope.reset = function() {
+            $scope.user = angular.copy($scope.master);
+          };
 
-        $scope.reset();
-      }
+          $scope.reset();
+        }]);
     </script>
   </file>
 </example>
@@ -130,7 +132,7 @@ This allows us to extend the above example with these features:
 - SAVE button is enabled only if form has some changes and is valid
 - custom error messages for `user.email` and `user.agree`
 
-<example>
+<example module="formExample">
   <file name="index.html">
     <div ng-controller="Controller">
       <form name="form" class="css-form" novalidate>
@@ -159,23 +161,24 @@ This allows us to extend the above example with these features:
   </file>
 
   <file name="script.js">
-    function Controller($scope) {
-      $scope.master = {};
+    angular.module('formExample', [])
+      .controller('ExampleController', ['$scope', function($scope) {
+        $scope.master = {};
 
-      $scope.update = function(user) {
-        $scope.master = angular.copy(user);
-      };
+        $scope.update = function(user) {
+          $scope.master = angular.copy(user);
+        };
 
-      $scope.reset = function() {
-        $scope.user = angular.copy($scope.master);
-      };
+        $scope.reset = function() {
+          $scope.user = angular.copy($scope.master);
+        };
 
-      $scope.isUnchanged = function(user) {
-        return angular.equals(user, $scope.master);
-      };
+        $scope.isUnchanged = function(user) {
+          return angular.equals(user, $scope.master);
+        };
 
-      $scope.reset();
-    }
+        $scope.reset();
+      }]);
   </file>
 </example>
 
