Angular organization and modularity - controller structure

Question

I've seen two different approaches to organizing modules and controller structure in Angular 1.x.

The first, below, is the way I'm familiar with where you separate out the controllers into their own files and attach them to the parent angular module.

The second, create a large controller file to house related controllers and attach them to the parent controller, then inject the controller as a module into the parent angular module.

Which is more performant? Is there a difference?

App.js

angular
    .module('mainApp', [
        'a bunch of dependencies'
    ])
    .run(['a bunch of dependencies', function(a bunch of dependencies){

myControllerA.js

angular
    .module('mainApp')
    .controller('myControllerA', ['a bunch of dependencies',
        function(a bunch of dependencies) {

myControllerB.js

angular
    .module('mainApp')
    .controller('myControllerB', ['a bunch of dependencies',
        function(a bunch of dependencies) {

App.js

var app = angular.module('mainApp', ['mainController', 'a bunch of dependencies']);

app.run(['a bunch of dependencies', function(mainController, a bunch of dependencies) {

mainController.js

var mainController = angular.module('mainController', [
  'a bunch of dependencies'
]);

mainController.config(function(a bunch of dependencies) {
   ...
});

mainController.controller('controllerA', ['a bunch of dependencies', function(a bunch of dependencies) {
  ...

mainController.controller('controllerB', ['a bunch of dependencies', function(a bunch of dependencies) {
  ...

Have a look a this question stackoverflow.com/questions/20995605/… — lenilsondc
– lenilsondc, Commented Dec 1, 2016 at 17:49

Jon · Accepted Answer · 2016-12-01 18:08:13Z

1

What has been really helpful for me was to follow this angular styleguide. It is Angular Team endorsed, and due to how things are structured, it makes moving to Angular 2 less painful, if you ever have to do that.

If you don't like that, there is another style guide that is referenced in the above link that is good as well.

Using either one of these style guides, they both recommend separating out the files. I don't think this is for performance as much as for ease of use, especially as the application grows. Having everything in one file will become unsustainable

answered Dec 1, 2016 at 18:08

Jon

2,71123 silver badges28 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angular organization and modularity - controller structure

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related