AngularControllers.js

/*
  **** ControllerAs Syntax ****
*/



/* ControllerAs with an anonymous function & array annotation */
angular
  .module('myApp')
  .controller('MainController', ['$http', function($http) {
    var vm = this;
    vm.title = 'AngularJS, the Superheroic MVW Framework';
    vm.names = ['Nicole', 'Layne', 'Winford', 'Mattie', 'Lawanda'];
    vm.extraNames = ['Diane', 'Santos', 'Liz', 'Gwyn'];
    vm.showNames = true;
    
    vm.addName = function() {
      if (vm.extraNames.length) vm.names.push(vm.extraNames.shift());
    };
  }]);



/* ControllerAs with a function definition & array annotation */
angular
  .module('myApp')
  .controller('MainController', ['$http', MainController]);

function MainController ($http) {
  var vm = this;
  vm.title = 'AngularJS, the Superheroic MVW Framework';
  vm.names = ['Nicole', 'Layne', 'Winford', 'Mattie', 'Lawanda'];
  vm.extraNames = ['Diane', 'Santos', 'Liz', 'Gwyn'];
  vm.showNames = true;

  vm.addName = function() {
    if (vm.extraNames.length) vm.names.push(vm.extraNames.shift());
  };
}



/* ControllerAs with an anonymous function & $inject */

// no dice, can't attach $inject to an anonymous function



/* ControllerAs with a function definition & $inject */
angular
  .module('myApp')
  .controller('MainController', MainController);
  
MainController.$inject = ['$http'];

function MainController ($http) {
  var vm = this;
  vm.title = 'AngularJS, the Superheroic MVW Framework';
  vm.names = ['Nicole', 'Layne', 'Winford', 'Mattie', 'Lawanda'];
  vm.extraNames = ['Diane', 'Santos', 'Liz', 'Gwyn'];
  vm.showNames = true;

  vm.addName = function() {
    if (vm.extraNames.length) vm.names.push(vm.extraNames.shift());
  };
}



/*
  **** $scope Syntax ****
*/



/* $scope with an anonymous function & array annotation */
angular
  .module('myApp')
  .controller('MainController', ['$scope', '$http', function($scope, $http) {
    $scope.title = 'AngularJS, the Superheroic MVW Framework';
    $scope.names = ['Nicole', 'Layne', 'Winford', 'Mattie', 'Lawanda'];
    $scope.extraNames = ['Diane', 'Santos', 'Liz', 'Gwyn'];
    $scope.showNames = true;
    
    $scope.addName = function() {
      if ($scope.extraNames.length) $scope.names.push($scope.extraNames.shift());
    };
  }]);



/* $scope with a function definition & array annotation */
angular
  .module('myApp')
  .controller('MainController', ['$scope', '$http', MainController]);

function MainController ($scope, $http) {
  $scope.title = 'AngularJS, the Superheroic MVW Framework';
  $scope.names = ['Nicole', 'Layne', 'Winford', 'Mattie', 'Lawanda'];
  $scope.extraNames = ['Diane', 'Santos', 'Liz', 'Gwyn'];
  $scope.showNames = true;

  $scope.addName = function() {
    if ($scope.extraNames.length) $scope.names.push($scope.extraNames.shift());
  };
}



/* $scope with an anonymous function & $inject */

// no dice



/* $scope with a function definition & $inject */
angular
  .module('myApp')
  .controller('MainController', MainController);
  
MainController.$inject = ['$scope', '$http'];

function MainController ($scope, $http) {
  $scope.title = 'AngularJS, the Superheroic MVW Framework';
  $scope.names = ['Nicole', 'Layne', 'Winford', 'Mattie', 'Lawanda'];
  $scope.extraNames = ['Diane', 'Santos', 'Liz', 'Gwyn'];
  $scope.showNames = true;

  $scope.addName = function() {
    if ($scope.extraNames.length) $scope.names.push($scope.extraNames.shift());
  };
}