Angularjs error: the application is not defined

advertisements

I have a loginController.js,loginService.js,app.js and a view page

app.js

var validation = angular.module('validationApp', ['ui.router','ngDialog','ngSanitize','angularSpinner']);
validation.config(function ($stateProvider, $urlRouterProvider) {
    $urlRouterProvider.otherwise('/login');
    $stateProvider
    .state('login', {
        url : '/login',
        views: {
            "mainView": {
               controller: 'loginController',
               templateUrl: '/public/app/login/loginView.phtml'
            },
        }
    }).run(['$rootScope', '$location', '$http', function ($rootScope, $location, $http) {

    $rootScope.globals = JSON.parse(localStorage.getItem('globals')) || {};
    if ($rootScope.globals.currentUser) {
        $http.defaults.headers.common['Authorization'] = 'Basic ' + $rootScope.globals.currentUser.authdata;
    }
    $rootScope.$on('$locationChangeStart', function (event, next, current) {

        var loggedIn = $rootScope.globals.currentUser;
        if (!loggedIn) {
            $location.path('/login');
        } else if (loggedIn && $location.path() == '/login') {
            $location.path('/validation');
        }
    });

}]);

loginService.js

app.factory('loginService', ['$http', '$rootScope', function ($http, $rootScope) {
    var service = {};

    service.Login            = Login;
    service.SetCredentials   = SetCredentials;
    service.ClearCredentials = ClearCredentials;

    return service;
  function Login(user, callback)
    {
        var request = $http({
            method  : "post",
            url     : "/app/index/login",
            data    : {
                        userEmail: user.userEmail,
                        password: user.password
                      }
        }).success(function (response, status, headers, config) {
            callback(response);
        });
    };

loginController.js

validation.controller('loginController',['$scope','$http', '$location','loginService',function($scope,$http,$location,loginService) {

        $scope.submitForm = function(user) {

        $http({
            method: 'post',
            url: '/index.php/home/create',
            data: {
                username:$scope.user.userName,
                password:$scope.user.password,
            },
            headers: {'Content-Type': 'application/x-www-form-urlencoded'}
        }).success(function(response){
                     loginService.SetCredentials(response.userData);
                    ..............................

while executing my code i am getting an error like :

1.app is not defined in loginService.js

2.Error: $injector:unpr Unknown Provider Unknown provider: loginServiceProvider <- loginService <- loginController

I am new in angularjs.so please help me to solve this.


A more sofisticated aproach would be to get the ngApp in each file. This removes the issues you have at the moment with not referencing the correct global variable ('don't polute the global scope' is a statement you might want to consider as well).

angular.module('validationApp').controller(...)

or

angular.module('validationApp').factory(...)