Angularjs Unknown provider error

Question

I am getting the

Error: [$injector:unpr] Unknown provider: mvProfileCtrlProvider <- mvProfileCtrl

in my error, I have already made sure that it is included in my scripts and is accessible ( I can open it from chrome-debugger > sources > mvProfileCtrl.js ) so it is available for referencing I guess. But still here are the two relevant files:

 angular.module('app').controller('navBarLoginController',function($scope,$http,mvIdentity,mvNotifier,mvAuth,mvProfileCtrl,$location) {
    $scope.identity = mvIdentity;
    $scope.signin = function(username,password) {
        mvAuth.authenticateUser(username,password).then(function(success){
            if(success){
                mvNotifier.notify('You have successfully signed in!');
            }else{
                mvNotifier.notify('Username/Password combination incorrect');
            }
        })
    }
    var profile = mvProfileCtrl;
    $scope.update = function(){
        profile.listen(mvIdentity.currentUser);
    }
    $scope.signout = function() {
        mvAuth.logoutUser().then(function() {
            $scope.username = "";
            $scope.password = "";
            mvNotifier.notify('You have successfully signed out!');
            $location.path('/');
        })
    }
})

and mvProfileCtrl.js -

angular.module('app').controller('mvProfileCtrl', function($scope, mvAuth, mvIdentity, mvNotifier) {
    $scope.mvIdentity = mvIdentity;
    $scope.update = function() {
        console.log("" + $scope.updateemail + " -- " + test);
        var newUserData = {
            username: $scope.updateemail,
            firstName: $scope.updatefname,
            lastName: $scope.updatelname
        }
        if($scope.updatepassword && $scope.updatepassword.length > 0) {
            newUserData.password = $scope.updatepassword;
        }

        mvAuth.updateCurrentUser(newUserData).then(function() {
            $('#profileModal').modal('toggle');
            mvNotifier.notify('Your user account has been updated');
        }, function(reason) {
            mvNotifier.error(reason);
        })
    }
    return {
        listen : function(currentUser) {
            if (!currentUser) return;
            $scope.updateemail = currentUser.username;
            $scope.updatefname = currentUser.firstName;
            $scope.updatelname = currentUser.lastName;
            console.log("--> " + $scope.updateemail + " -- " + test);
        }
    }
});

and the scripts file -

script(type="text/javascript", src="/vendor/jquery/dist/jquery.js")
script(type="text/javascript", src="/vendor/toastr/toastr.js")
script(type="text/javascript", src="/vendor/angular/angular.js")
script(type="text/javascript", src="/vendor/angular-resource/angular-resource.js")
script(type="text/javascript", src="/vendor/angular-route/angular-route.js")
script(type="text/javascript", src="/vendor/bootstrap/dist/js/bootstrap.js")
script(type="text/javascript", src="/vendor/bootstrap/js/dropdown.js")
script(type="text/javascript", src="/app/app.js")
script(type="text/javascript", src="/plugins/backstretch/jquery.backstretch.min.js")
script(type="text/javascript", src="/plugins/bxslider/jquery.bxslider.min.js")
script(type="text/javascript", src="/plugins/bxslider/jquery.bxslider.min.js")
script(type="text/javascript", src="/app/account/navBarLoginController.js")
script(type="text/javascript", src="/app/common/mvNotifier.js")
script(type="text/javascript", src="/app/account/mvIdentity.js")
script(type="text/javascript", src="/app/account/mvauth.js")
script(type="text/javascript", src="/app/account/mvUser.js")
script(type="text/javascript", src="/app/admin/mvUserListCtrl.js")
script(type="text/javascript", src="/app/account/mvSignupCtrl.js")
script(type="text/javascript", src="/app/account/mvProfileCtrl.js")  

Answer 1

The issue here is, that you are trying inject controller into another controller. And that's not how it should be.

Please check the:

• Can one controller call another?

To see, how we should communicate among controllers - using a shared service.

The biggest difference between services and controllers is (see Developer Guide / Dependency Injection ):

Controllers are special in that, unlike services, there can be many instances of them in the application. For example, there would be one instance for every ng-controller directive in the template.

So, when we are trying to call methods of one controller inside of the other one ... we should move it into a singleton service