CODEWITHSUNDEEP
angularjsdependency-injection
JGCW
JGCW

Reputation: 1529

Angular Error: adding dependecy gives $injector:unpr Unknown Provider

I decided to add ngInfinitiScroll plugin to my application. Hence i called the file :

<script type="text/javascript" src="{!! asset('/js/ng-infinite-scroll.min.js') !!}"></script>

In my events.js file i initiated the module like this:

(function(window) {

    // Define the `app` module
    var app = angular.module('stayhyper', ['infinite-scroll']); 

    app.controller('eventController', ['$scope', '$rootScope', '$http', 'myService',

        function($scope, $rootScope, $http, myService) {

        } // end of main function

    ]); // end of controller

})(window);

Then I get the following error:

Error: $injector:unpr Unknown Provider

Unknown provider: myServiceProvider <- myService<- eventController

MyService (this is in a seperate js file which is loaded in the header):

app.service('myService', function() {

            this.URL= function() {
               // set the main route of the site
                var subhost = "/"
                if (window.location.host == "localhost") {
                    subhost = "/myapp/public/"
                }

                window.urlRoot = window.location.origin + subhost;//main root of the site
                return window.urlRoot;
            }
            this.APIURL= function() {
               // set the main route of the site
                var subhost = "/api/"
                if (window.location.host == "localhost") {
                    subhost = "/myapp/public/api/"
                }

                window.urlRoot = window.location.origin + subhost;//main root of the site
                return window.urlRoot;
            }


    });

Upvotes: 0

Views: 99

Answers (1)

Sajeetharan
Sajeetharan

Reputation: 222552

You need to load the event.js initially and then mainapp.js , then only the module will be created initially, also make sure you have added the references in html for infinite-scroll

So the order will be,

 <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/ngInfiniteScroll/1.2.2/ng-infinite-scroll.js"></script>
 <script type="text/javascript" src="mainapp.js"></script>
 <script type="text/javascript" src="event.js"></script>

also make sure you are not calling the module again.

Upvotes: 1

Related Questions