Error [$injector:unpr] when injecting sanitize dependency

Question

I am trying to use progressBar from AngularUIBootstrap .

I have a objectFactory.js file:

(function () {
    var objectiveFactory = function ($http, animate) {
        debugger;
        return {
            getObjectives: function () {                
                return $http.get('/api/Objective/');
            }
        };

    };
    debugger;
    try {
        //objectiveFactory.$inject = ['$http', '$animate', '$sanitize'];// error
        objectiveFactory.$inject = ['$http', '$animate'];// no error
        angular.module('app', []).factory('objectiveFactory', objectiveFactory);
    }
    catch (e)
    {}    
}());

It is really weird, however if I add new dependency $sanitize :

objectiveFactory.$inject = ['$http', '$animate', '$sanitize'];// not working

Then I've got an error:

angular.js:13920 Error: [$injector:unpr] http://errors.angularjs.org/1.5.8/ $injector/unpr?p0=sanitizeProvider%20%3C-%20sanitize%20%3C-%20objectiveController at Error (native) at http://localhost:15533/Scripts/angular.min.js:6:412 at http://localhost:15533/Scripts/angular.min.js:43:174 at Object.d [as get]

But '$http' and '$animate', injections perfectly works.

I've explored a lot of info and double checked the following advices in my Web API application:

1. I've checked versions angular'js file and angular-sanitize.js and they are the same 1.5.8 .

2. My bundle files look like this:

     bundles.Add(new ScriptBundle("~/bundles/angularjs").Include( "~/Scripts/jquery-1.10.2.min.js", "~/Scripts/bootstrap.min.js", "~/Scripts/angular.min.js", "~/Scripts/angular-animate.min.js", "~/Scripts/angular-sanitize.min.js", "~/Scripts/ui-bootstrap-tpls-2.1.3.js", "~/Scripts/objectiveFactory.js", "~/Scripts/objective.js" )); 

3. I've tried various ways of injection:

    objectiveController.$inject = ['$scope', '$http', 'objectiveFactory', '$animate', 'ngSanitize']; objectiveController.$inject = ['$scope', '$http', 'objectiveFactory', '$animate', '$sanitize']; objectiveController.$inject = ['$scope', '$http', 'objectiveFactory', '$animate', 'sanitize']; 

However, the error is the same:

angular.js:13920 Error: [$injector:unpr] Unknown provider:

Does anybody know what I've done wrong? ( '$http' injection perfectly works)

Answer 1

Inject ngSanitize into your main module to work with $sanitize ...

You need to do same thing for $animate as well, inject ngAnimate