Misspelled or missing module?

I have an ASP.NET MVC5 app in which I am using AngularJS. In this, I have a module called atTheMS with a factory for a service called albumService and 3 controllers: ListController, EditController, and DetailsController. The service and controllers are all dependent on the atTheMS module, yet I get this error only from albumService

Uncaught Error: [$injector:nomod] Module 'atTheMS' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.

It says it is happening at (anonymous function) albumService.js:27

(function (app) {
var albumService = function ($http, albumApiUrl) {
    var getAll = function () {
        return $http.get(albumApiUrl);
    };
    var getById = function (id) {
        return $http.get(albumApiUrl + id);
    };
    var update = function (album) {
        return $http.put(albumApiUrl + album.Id, album);
    };
    var create = function (album) {
        return $http.post(albumApiUrl, album);
    };
    var destroy = function (album) {
        return $http.delete(albumApiUrl + album.Id);
    };
    return {
        getAll: getAll,
        getById: getById,
        update: update,
        create: create,
        delete: destroy
    };
};
app.factory("albumService", albumService);
}(angular.module("atTheMS")));

The error does not occur on the other files that use (angular.module("atTheMS")) and this was generated copying another factory I have which is the exact same except the word "album" is replaced by the word "book" and the module is "atTheLibrary" and there are no errors when I'm on that page. I'm confused why this would be different. Any help would be appreciated, thanks.

As requested, here's the View:

@section scripts {
    <script src="~/Scripts/angular.js"></script>
    <script src="~/Scripts/angular-route.js"></script>
    <script src="~/Client/Scripts/Album/albumService.js"></script>
    <script src="~/Client/Scripts/Album/atTheMS.js"></script>
    <script src="~/Client/Scripts/Album/ListController.js"></script>
    <script src="~/Client/Scripts/Album/DetailsController.js"></script>
    <script src="~/Client/Scripts/Album/EditController.js"></script>
}

<div data-ng-app="atTheMS">
    <ng-view></ng-view>
</div>
<hr />

Check in which file you are initializing the module - atTheMS. The angular module must be initialized/loaded before you can create a factory in that module. From your HTML it can be seen that the file albumService.js is being loaded before atTheMS.js file. Try loading the albumService.js file after atTheMS.js file.