AngularJS - How to separate controllers/modules? -

i have 1 application has 2 pages.

1 - list of users

2 - can manage particular user

in order organize create 2 separated controllers , 1 module inside app.js file , put stuff (custom filters, directives, factories...)

now want separate things in diferent files (or maybe folders too).

how can this?

angular.module('app', []).  controller('listcontroller', function ($scope) {     ...  }).  controller('managecontroller', function ($scope) {     ... }).  factory('api', ['$resource',  function($resource) {   return {     ...   }; }]).  filter('formtadata', function(){    return function(data, modo){        ...    } }). 

other issue controllers have different dependencies , in actual way have include them in module (and scripts on page) if page don't need them.

appconfig.js

angular.module('app', [dep1, dep2]); 

listcontroller.js

angular.module('app').controller('listcontroller', function ($scope) {     ...  }); 

detailscontroller.js

angular.module('app').controller('managecontroller', function ($scope) {     ... }); 

apiservice.js

angular.module('app').factory('api', ['$resource',  function($resource) {   return {     ...   }; }]); 

formatdatafilter.js

angular.module('app').filter('formtadata', function(){    return function(data, modo){        ...    } });