Skip to content
This repository was archived by the owner on Apr 12, 2024. It is now read-only.

Commit f6877ed

Browse files
committed
docs(guide/controller): use -Controller suffix
Previously, the convention was to end controllers with -Ctrl. The new convention is to use -Controller
1 parent d6bcbc7 commit f6877ed

File tree

1 file changed

+22
-22
lines changed

1 file changed

+22
-22
lines changed

docs/content/guide/controller.ngdoc

Lines changed: 22 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -134,7 +134,7 @@ string "very". Depending on which button is clicked, the `spice` model is set to
134134

135135
<example module="spicyApp1">
136136
<file name="index.html">
137-
<div ng-controller="SpicyCtrl">
137+
<div ng-controller="SpicyController">
138138
<button ng-click="chiliSpicy()">Chili</button>
139139
<button ng-click="jalapenoSpicy()">Jalapeño</button>
140140
<p>The food is {{spice}} spicy!</p>
@@ -143,7 +143,7 @@ string "very". Depending on which button is clicked, the `spice` model is set to
143143
<file name="app.js">
144144
var myApp = angular.module('spicyApp1', []);
145145

146-
myApp.controller('SpicyCtrl', ['$scope', function($scope){
146+
myApp.controller('SpicyController', ['$scope', function($scope) {
147147
$scope.spice = 'very';
148148

149149
$scope.chiliSpicy = function() {
@@ -160,9 +160,9 @@ string "very". Depending on which button is clicked, the `spice` model is set to
160160
Things to notice in the example above:
161161

162162
- The `ng-controller` directive is used to (implicitly) create a scope for our template, and the
163-
scope is augmented (managed) by the `SpicyCtrl` Controller.
164-
- `SpicyCtrl` is just a plain JavaScript function. As an (optional) naming convention the name
165-
starts with capital letter and ends with "Ctrl" or "Controller".
163+
scope is augmented (managed) by the `SpicyController` Controller.
164+
- `SpicyController` is just a plain JavaScript function. As an (optional) naming convention the name
165+
starts with capital letter and ends with "Controller" or "Controller".
166166
- Assigning a property to `$scope` creates or updates the model.
167167
- Controller methods can be created through direct assignment to scope (see the `chiliSpicy` method)
168168
- The Controller methods and properties are available in the template (for the `<div>` element and
@@ -175,7 +175,7 @@ previous example.
175175

176176
<example module="spicyApp2">
177177
<file name="index.html">
178-
<div ng-controller="SpicyCtrl">
178+
<div ng-controller="SpicyController">
179179
<input ng-model="customSpice">
180180
<button ng-click="spicy('chili')">Chili</button>
181181
<button ng-click="spicy(customSpice)">Custom spice</button>
@@ -185,18 +185,18 @@ previous example.
185185
<file name="app.js">
186186
var myApp = angular.module('spicyApp2', []);
187187

188-
myApp.controller('SpicyCtrl', ['$scope', function($scope){
188+
myApp.controller('SpicyController', ['$scope', function($scope) {
189189
$scope.customSpice = "wasabi";
190190
$scope.spice = 'very';
191191

192-
$scope.spicy = function(spice){
192+
$scope.spicy = function(spice) {
193193
$scope.spice = spice;
194194
};
195195
}]);
196196
</file>
197197
</example>
198198

199-
Notice that the `SpicyCtrl` Controller now defines just one method called `spicy`, which takes one
199+
Notice that the `SpicyController` Controller now defines just one method called `spicy`, which takes one
200200
argument called `spice`. The template then refers to this Controller method and passes in a string
201201
constant `'chili'` in the binding for the first button and a model property `customSpice` (bound to an
202202
input box) in the second button.
@@ -213,13 +213,13 @@ more information about scope inheritance.
213213
<example module="scopeInheritance">
214214
<file name="index.html">
215215
<div class="spicy">
216-
<div ng-controller="MainCtrl">
216+
<div ng-controller="MainController">
217217
<p>Good {{timeOfDay}}, {{name}}!</p>
218218

219-
<div ng-controller="ChildCtrl">
219+
<div ng-controller="ChildController">
220220
<p>Good {{timeOfDay}}, {{name}}!</p>
221221

222-
<div ng-controller="GrandChildCtrl">
222+
<div ng-controller="GrandChildController">
223223
<p>Good {{timeOfDay}}, {{name}}!</p>
224224
</div>
225225
</div>
@@ -234,14 +234,14 @@ more information about scope inheritance.
234234
</file>
235235
<file name="app.js">
236236
var myApp = angular.module('scopeInheritance', []);
237-
myApp.controller('MainCtrl', ['$scope', function($scope){
237+
myApp.controller('MainController', ['$scope', function($scope) {
238238
$scope.timeOfDay = 'morning';
239239
$scope.name = 'Nikki';
240240
}]);
241-
myApp.controller('ChildCtrl', ['$scope', function($scope){
241+
myApp.controller('ChildController', ['$scope', function($scope) {
242242
$scope.name = 'Mattie';
243243
}]);
244-
myApp.controller('GrandChildCtrl', ['$scope', function($scope){
244+
myApp.controller('GrandChildController', ['$scope', function($scope) {
245245
$scope.timeOfDay = 'evening';
246246
$scope.name = 'Gingerbreak Baby';
247247
}]);
@@ -252,11 +252,11 @@ Notice how we nested three `ng-controller` directives in our template. This will
252252
scopes being created for our view:
253253

254254
- The root scope
255-
- The `MainCtrl` scope, which contains `timeOfDay` and `name` properties
256-
- The `ChildCtrl` scope, which inherits the `timeOfDay` property but overrides (hides) the `name`
255+
- The `MainController` scope, which contains `timeOfDay` and `name` properties
256+
- The `ChildController` scope, which inherits the `timeOfDay` property but overrides (hides) the `name`
257257
property from the previous
258-
- The `GrandChildCtrl` scope, which overrides (hides) both the `timeOfDay` property defined in `MainCtrl`
259-
and the `name` property defined in `ChildCtrl`
258+
- The `GrandChildController` scope, which overrides (hides) both the `timeOfDay` property defined in `MainController`
259+
and the `name` property defined in `ChildController`
260260

261261
Inheritance works with methods in the same way as it does with properties. So in our previous
262262
examples, all of the properties could be replaced with methods that return string values.
@@ -316,11 +316,11 @@ describe('state', function() {
316316

317317
beforeEach(inject(function($rootScope, $controller) {
318318
mainScope = $rootScope.$new();
319-
$controller('MainCtrl', {$scope: mainScope});
319+
$controller('MainController', {$scope: mainScope});
320320
childScope = mainScope.$new();
321-
$controller('ChildCtrl', {$scope: childScope});
321+
$controller('ChildController', {$scope: childScope});
322322
grandChildScope = childScope.$new();
323-
$controller('GrandChildCtrl', {$scope: grandChildScope});
323+
$controller('GrandChildController', {$scope: grandChildScope});
324324
}));
325325

326326
it('should have over and selected', function() {

0 commit comments

Comments
 (0)