angularjs - What is the difference between these two ways of defining controllers? -

angularjs - What is the difference between these two ways of defining controllers? -

regarding controller definitions. difference between this...

angular.module('myapp', ['ui.bootstrap']); function carouselctrl($scope) { ... }

and this...

var myappmodule = angular.module('myapp', ['ui.bootstrap']); myappmodule.controller('carouselctrl', function($scope){ ... }

it seems both of them access ui.bootstrap. how first carouselctrl function connected angular.module?

the first 1 global function. should not using it. "connected" module because connected everything.

the sec 1 controller declared in module. fine , it's usual approach. can have module directives, module services, etc. more organizing application

the safest alternative using annotations:

var myappmodule = angular.module('myapp', ['ui.bootstrap']); myappmodule.controller('carouselctrl', [ '$scope', '$http', function($scope, $http){ ... }]);

as golo roden points out in comments, can avoid global variables referencing controller this:

angular.module('myapp').controller(...);

this way application can minified without breaking, explained in manual https://docs.angularjs.org/guide/di reason dependency injection looks components name. can minify name of function values in arrays never altered. order in array important. matches 1-1 parameters in function.

angularjs