javascript - Do I need to define a module for each separate file? -

new angular, trying figure out how should modularize app.

app     toolbar         toolbar.module.js         menu.html         index.html         search.html     sub-system-1         subsystem1.module.js         directive-template.html     sub-system-2         subsystem2.module.js         directive-template.html 

the toolbar.module.js example has 3 directives (menu, index, search) , each directive has own controller, service. controllers, directive definitions , services defined in toolbar.module.js...kind of confusing when comes maintaining code.

is possible come finer grained setup such each directive enclosed in own file along side controller & service?

i figure add:

        menu.directive.js 

and inside there have like

var module = angular('toolbar.menu.directive',[]); module.directives(...);//add menu directive module 

then inside toolbar.modules have like:

var module = angular('toolbar',[toolbar.menu.directive]); 

is way can achieve defining lots of fine-grained modules?

no, don't have define tons of tiny modules. in angular, can reference existing module omitting second argument:

angular.module('modulename'); 

by doing this, can split various toolbar directives, controllers, , services separate files , in each file reference toolbar module so:

angular.module('toolbar')   .controller('menuctrl', function() {     // ...   });