Q:

Angular MVC app: Services go where?

I've been using angular for a few months now and understand it pretty well. I've always struggled with the MVC pattern, but for this next app I am working on, I am determined to knock that wall down.
I have my app setup like
index.html
/resources
    app.js
    /models
    /views
    /controllers

My question right now is where is the "correct" area to put services? For example, my first view is a login screen.
I need to make a service call out to a web service to login from LoginController.js
Right now I am putting the Service inside app.js like so
VforumJS.factory('LoginService', function($rootScope, $http)
{
    $http.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded; charset=UTF-8';
    return {
        login: function($email, $password)
        {
            data = {
                'type' : 'login',
                'email' : $email,
                'password' : $password
            };

            $http.post('resources/request.php', data, {timeout:20000})
                .success(function(data, status, headers, config)
                {
                    $rootScope.$broadcast('LoginComplete',{result:data});
                })
                .error(function(data, status, headers, config)
                {
                    log(status + ', data:" ' + data + '"');
                }
            );
        }
    }
});

When I get a response back from the web service, I then do a $rootScope.$broadcast that my LoginController.js is listening for. 
My other though was to create a services folder and store services in there. Any suggestions?

A:

you have 3 differents way to organize your files and your services.

Monolithic files
Monolithic folders
Organizate by feature

Here you will find your answer. Scroll down to the "File Organization" section. It is an excellent article.
I hope it will help !

