From c3024254b6535486097648503e2ddae5562b6ddc Mon Sep 17 00:00:00 2001 From: Felix Date: Thu, 10 Oct 2013 17:19:55 -0430 Subject: docs(guide/controller): use `.controller` syntax Use the recommended `module.controller` syntax rather than global functions to define controllers in the examples. --- .../dev_guide.mvc.understanding_controller.ngdoc | 75 ++++++++++++---------- 1 file changed, 41 insertions(+), 34 deletions(-) (limited to 'docs/content') diff --git a/docs/content/guide/dev_guide.mvc.understanding_controller.ngdoc b/docs/content/guide/dev_guide.mvc.understanding_controller.ngdoc index 5e49902e..880601fa 100644 --- a/docs/content/guide/dev_guide.mvc.understanding_controller.ngdoc +++ b/docs/content/guide/dev_guide.mvc.understanding_controller.ngdoc @@ -103,23 +103,25 @@ string "very". Depending on which button is clicked, the `spice` model is set to ## A Spicy Controller Example

-
+
  
  
  The food is {{spice}} spicy!
 
 
-function SpicyCtrl($scope) {
- $scope.spice = 'very';
- $scope.chiliSpicy = function() {
-   $scope.spice = 'chili';
- }
- $scope.jalapenoSpicy = function() {
-  $scope.spice = 'jalapeño';
- }
-}
-
-
+var myApp = angular.module('SpicyApp', []);
+
+myApp.controller('SpicyCtrl', ['$scope', function($scope){
+    $scope.spicy = 'very';
+    
+    $scope.chiliSpicy = function() {
+        $scope.spice = 'chili';
+    };
+    
+    $scope.jalapenoSpicy = function() {
+        $scope.spice = 'jalapeño';
+    };
+}]);

Things to notice in the example above: @@ -147,19 +149,24 @@ previous example. ## Controller Method Arguments Example

-
- 
+
+ 
  
  
  The food is {{spice}} spicy!
 
 
-function SpicyCtrl($scope) {
- $scope.spice = 'very';
- $scope.spicy = function(spice) {
-   $scope.spice = spice;
- }
-}
+var myApp = angular.module('SpicyApp', []);
+
+myApp.controller('SpicyCtrl', ['$scope', function($scope){
+    $scope.customSpice = "wasabi";
+    $scope.spice = 'very';
+    
+    $scope.spicy = function(spice){
+        $scope.spice = spice;
+    };
+}]);
+

Notice that the `SpicyCtrl` controller now defines just one method called `spicy`, which takes one @@ -174,7 +181,7 @@ Controller inheritance in Angular is based on {@link api/ng.$rootScope.Scope Sco have a look at an example:

-
+
  Good {{timeOfDay}}, {{name}}!
  
   Good {{timeOfDay}}, {{name}}!
@@ -182,19 +189,19 @@ have a look at an example:
  
 
 
-function MainCtrl($scope) {
- $scope.timeOfDay = 'morning';
- $scope.name = 'Nikki';
-}
-
-function ChildCtrl($scope) {
- $scope.name = 'Mattie';
-}
-
-function BabyCtrl($scope) {
- $scope.timeOfDay = 'evening';
- $scope.name = 'Gingerbreak Baby';
-}
+var myApp = angular.module('MyApp', [])
+
+.controller('MainCtrl', ['$scope', function($scope){
+  $scope.timeOfDay = 'morning';
+  $scope.name = 'Nikki';
+}])
+.controller('ChildCtrl', ['$scope', function($scope){
+  $scope.name = 'Mattie';
+}])
+.controller('BabyCtrl', ['$scope', function($scope){
+  $scope.timeOfDay = 'evening';
+  $scope.name = 'Gingerbreak Baby';
+}]);

Notice how we nested three `ngController` directives in our template. This template construct will -- cgit v1.2.3