injecting angular-message dependency failing angular js

Question

i am new to angularjs. I am trying to make modular application. But i am not able to inject any dependency in my controller or services. i tried many blogs but i think i am missing something here. Can somebody please point out my error and help me with correct syntax. I would appreciate if you can add a little explaination or point me to correct direction.

its failing with error :

Error: $injector:unpr
Unknown Provider

Controller :

var myCtrls = angular.module('myapp', ['ngMessages']);

myCtrls.controller('DecorpotCtrl', [ '$scope', '$routeParams', 'cart', '$auth', 'User', '$rootScope',function($scope, $routeParams, cart, $auth, User, $rootScope) {
} ]);
myCtrls.controller('ProjectsController', [ '$scope', function($scope){

}]);

app.js :

var decorpot = angular.module('decorpot', ['ngRoute', 'satellizer']);

//
decorpot.config(['$routeProvider', '$provide', '$authProvider', function($routeProvider, $provide, $authProvider){
//state configs
}]);

Index.jsp :

    src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular-route.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular-messages.js"></script>
<script src="resources/core/js/application/app.js"></script>
<script src="resources/core/js/application/services.js"></script>
<script src="resources/core/js/application/controllers.js"></script>

Answer 1

ngMessages is a directive, it should be used in templates and not as a dependecy of a controller. An example of the provided link:

<form name="myForm">
    <label>
        Enter your name:
        <input type="text" name="myName" ng-model="name" ng-minlength="5" ng-maxlength="20"required />
    </label>
    <pre>myForm.myName.$error = {{ myForm.myName.$error | json }}</pre>

    <div ng-messages="myForm.myName.$error" style="color:maroon" role="alert">
        <div ng-message="required">You did not enter a field</div>
        <div ng-message="minlength">Your field is too short</div>
        <div ng-message="maxlength">Your field is too long</div>
    </div>
</form>

You will be able to use it in your templates just by doing:

var myCtrls = angular.module('myapp', ['ngMessages']);

As per your comments and edits, seems you are not declaring ngRoute as a dependency in your myapp module:

var myCtrls = angular.module('myapp', ['ngMessages', 'ngRoute']);