I have a question regarding organizing bulk code in an AngularJs controller. I currently have a controller named userDashboard.js with numerous methods for making API calls to retrieve data, such as:
1) Charts - Chart 1, Chart 2, Chart 3, etc.
2) Tables - Table 1, Table 2, etc.
3) Sections - 1, 2, 3, etc.
I would like to create separate JavaScript files for each functionality within the same controller to improve code readability and maintainability. How can I accomplish this?
Would it work if I use the same controller name in other files, like:
controller1.js
'use strict';
angular.module('onepgr')
.controller('userDashboard',
function ($scope, $routeParams, MyAppService, Excel, $timeout) {
//API
//Chart
});
controller2.js
'use strict';
angular.module('onepgr')
.controller('userDashboard',
function ($scope, $routeParams, MyAppService, Excel, $timeout) {
//Table function
//API
});