From 575f63ac508a988e0c0ecbf93f62ea6f4bab13c0 Mon Sep 17 00:00:00 2001
From: James Dunn
Date: Thu, 3 Oct 2013 10:16:44 +0100
Subject: docs(tutorial): update examples to show best practices
Closes #4256, #4255, #4254, #4253, #4250, #4092
---
docs/content/tutorial/step_02.ngdoc | 8 ++++++--
docs/content/tutorial/step_04.ngdoc | 6 ++++--
docs/content/tutorial/step_07.ngdoc | 8 +++-----
docs/content/tutorial/step_08.ngdoc | 7 +++----
docs/content/tutorial/step_10.ngdoc | 7 +++----
docs/content/tutorial/step_11.ngdoc | 16 +++++-----------
6 files changed, 24 insertions(+), 28 deletions(-)
(limited to 'docs/content/tutorial')
diff --git a/docs/content/tutorial/step_02.ngdoc b/docs/content/tutorial/step_02.ngdoc
index e21e18df..f9f9b2d8 100644
--- a/docs/content/tutorial/step_02.ngdoc
+++ b/docs/content/tutorial/step_02.ngdoc
@@ -74,7 +74,10 @@ the `PhoneListCtrl` __controller__:
__`app/js/controllers.js`:__
-function PhoneListCtrl($scope) {
+
+var myApp = angular.module('myApp',[]);
+
+myApp.controller('PhoneListCtrl', ['$scope', function($scope) {
$scope.phones = [
{"name": "Nexus S",
"snippet": "Fast just got faster with Nexus S."},
@@ -83,7 +86,8 @@ function PhoneListCtrl($scope) {
{"name": "MOTOROLA XOOM™",
"snippet": "The Next, Next Generation tablet."}
];
-}
+}]);
+
diff --git a/docs/content/tutorial/step_04.ngdoc b/docs/content/tutorial/step_04.ngdoc
index e14b3f8d..72ac70d5 100644
--- a/docs/content/tutorial/step_04.ngdoc
+++ b/docs/content/tutorial/step_04.ngdoc
@@ -65,7 +65,9 @@ necessary!
__`app/js/controllers.js`:__
-function PhoneListCtrl($scope) {
+var myApp = angular.module('myApp',[]);
+
+myApp.controller('PhoneListCtrl', ['$scope', function($scope) {
$scope.phones = [
{"name": "Nexus S",
"snippet": "Fast just got faster with Nexus S.",
@@ -79,7 +81,7 @@ function PhoneListCtrl($scope) {
];
$scope.orderProp = 'age';
-}
+}]);
* We modified the `phones` model - the array of phones - and added an `age` property to each phone
diff --git a/docs/content/tutorial/step_07.ngdoc b/docs/content/tutorial/step_07.ngdoc
index ea46f5ef..35f1f920 100644
--- a/docs/content/tutorial/step_07.ngdoc
+++ b/docs/content/tutorial/step_07.ngdoc
@@ -69,7 +69,7 @@ both module systems can live side by side and fulfil their goals.
__`app/js/app.js`:__
-angular.module('phonecat', []).
+var myApp = angular.module('phonecat', []).
config(['$routeProvider', function($routeProvider) {
$routeProvider.
when('/phones', {templateUrl: 'partials/phone-list.html', controller: PhoneListCtrl}).
@@ -124,11 +124,9 @@ __`app/index.html`:__
__`app/js/controllers.js`:__
...
-function PhoneDetailCtrl($scope, $routeParams) {
+myApp.controller('PhoneDetailCtrl', ['$scope', '$routeParams', function($scope, $routeParams) {
$scope.phoneId = $routeParams.phoneId;
-}
-
-//PhoneDetailCtrl.$inject = ['$scope', '$routeParams'];
+}]);
diff --git a/docs/content/tutorial/step_08.ngdoc b/docs/content/tutorial/step_08.ngdoc
index 7e7eb3ee..503b4347 100644
--- a/docs/content/tutorial/step_08.ngdoc
+++ b/docs/content/tutorial/step_08.ngdoc
@@ -61,13 +61,12 @@ the same way as the phone list controller.
__`app/js/controllers.js`:__
-function PhoneDetailCtrl($scope, $routeParams, $http) {
+var myApp = angular.module('myApp',[]);
+myApp.controller('PhoneDetailCtrl', ['$scope', '$routeParams', '$http', function($scope, $routeParams, $http) {
$http.get('phones/' + $routeParams.phoneId + '.json').success(function(data) {
$scope.phone = data;
});
-}
-
-//PhoneDetailCtrl.$inject = ['$scope', '$routeParams', '$http'];
+}]);
To construct the URL for the HTTP request, we use `$routeParams.phoneId` extracted from the current
diff --git a/docs/content/tutorial/step_10.ngdoc b/docs/content/tutorial/step_10.ngdoc
index 632089cb..b612d996 100644
--- a/docs/content/tutorial/step_10.ngdoc
+++ b/docs/content/tutorial/step_10.ngdoc
@@ -25,7 +25,8 @@ GitHub}:
__`app/js/controllers.js`:__
...
-function PhoneDetailCtrl($scope, $routeParams, $http) {
+var myApp = angular.module('myApp',[]);
+myApp.controller('PhoneDetailCtrl', ['$scope', '$routeParams', '$http', function($scope, $routeParams, $http) {
$http.get('phones/' + $routeParams.phoneId + '.json').success(function(data) {
$scope.phone = data;
$scope.mainImageUrl = data.images[0];
@@ -34,9 +35,7 @@ function PhoneDetailCtrl($scope, $routeParams, $http) {
$scope.setImage = function(imageUrl) {
$scope.mainImageUrl = imageUrl;
}
-}
-
-//PhoneDetailCtrl.$inject = ['$scope', '$routeParams', '$http'];
+}]);
In the `PhoneDetailCtrl` controller, we created the `mainImageUrl` model property and set its
diff --git a/docs/content/tutorial/step_11.ngdoc b/docs/content/tutorial/step_11.ngdoc
index aff35703..8fdd31fb 100644
--- a/docs/content/tutorial/step_11.ngdoc
+++ b/docs/content/tutorial/step_11.ngdoc
@@ -39,7 +39,7 @@ __`app/index.html`.__
__`app/js/services.js`.__
-angular.module('phonecatServices', ['ngResource']).
+var myApp = angular.module('phonecatServices', ['ngResource']).
factory('Phone', function($resource){
return $resource('phones/:phoneId.json', {}, {
query: {method:'GET', params:{phoneId:'phones'}, isArray:true}
@@ -79,16 +79,12 @@ __`app/js/controllers.js`.__
...
-function PhoneListCtrl($scope, Phone) {
+myApp.controller('PhoneListCtrl', ['$scope', 'Phone', function($scope, Phone) {
$scope.phones = Phone.query();
$scope.orderProp = 'age';
-}
+}]);
-//PhoneListCtrl.$inject = ['$scope', 'Phone'];
-
-
-
-function PhoneDetailCtrl($scope, $routeParams, Phone) {
+myApp.controller('PhoneDetailCtrl', ['$scope', '$routeParams', 'Phone', function($scope, $routeParams, Phone) {
$scope.phone = Phone.get({phoneId: $routeParams.phoneId}, function(phone) {
$scope.mainImageUrl = phone.images[0];
});
@@ -96,9 +92,7 @@ function PhoneDetailCtrl($scope, $routeParams, Phone) {
$scope.setImage = function(imageUrl) {
$scope.mainImageUrl = imageUrl;
}
-}
-
-//PhoneDetailCtrl.$inject = ['$scope', '$routeParams', 'Phone'];
+}]);
Notice how in `PhoneListCtrl` we replaced:
--
cgit v1.2.3