Im learning AngualrJS and wonder if someone can advise what good practice would be with the below scenario.
I have the below code (im going to delete most of it and highlight the area i would like to focus on) which is based on a 3rd party product.
FileOne.js content below
(function () {
"use strict";
function controller(EventService) {
angular.module("something").controller("Project.Controller", controller);
})();
(function () {
"use strict";
function tableController() {
angular.module("something").controller("Project.TableController", tableController);
})();
And the HTML
<div ng-controller="Project.Controller as vm">
<div ng-controller="Project.TableController as vm">
</div>
</div>
My question is as follows. I have one js file (fileone.js) with 2 controllers and 2 functions doing 2 separate things. This can be seen my the HTML ng-controller as to where these controllers would be used.
My concern is as my project grows i dont want to have a million functions if i can help it so what would be the appropriate way to organise these files so if i need to re-use something im not having to re-write the code into another file for it to be used?
Keeping in mind the tableController would have different field names on different pages but it would be great to have one table but passing in a different DataSet if possible? Or simply should each html files have its own js file? If not how could i share controllers across multiple html pages especially if they are doing the same task?
Appreciate any ideas/thoughts
Thanks
