0

私はrequire jsでangularAMDを使用しており、アプリ構成ファイルで$ httpProvider.interceptorsに登録したいインターセプターサービスを作成しましたが、次のようにエラーをスローします

エラー: [$injector:unpr] http://errors.angularjs.org/1.4.8/ $injector/unpr?p0=cookieInjectorProvider%…eInjector%20%3C-%20%24http%20%3C-%20% 24templateRequest%20%3C-%20%24コンパイル(…)

以下は私の含意です

define(["angularAMD", "angular-route", "ui-bootstrap","ngCookies","common/service/interceptor-service"], function(angularAMD){
"use strict";

var app = angular.module("app", ["ui.router", "ui.bootstrap","ngAnimate","ngTouch","angular-carousel","ngCookies"]);

  //route
  app.config(["$stateProvider", "$urlRouterProvider", "$locationProvider","$httpProvider", function($stateProvider, $urlRouterProvider, $locationProvider,$httpProvider){
    $urlRouterProvider.otherwise('/');

    $stateProvider
    .state("home", angularAMD.route({

     url: "/",
     views:  {  

       'header':{
          /*...*/
        },

      },
      'content': {
        /*...*/
      },

      'footer': {
        /*...*/

      }
  }));
  **//angular is not able to find 'cookieInjector' service**
  $httpProvider.interceptors.push('cookieInjector');
  }]);


  // Bootstrap Angular when DOM is ready
  return angularAMD.bootstrap(app, false, document.getElementsByTagName("body")[0]);
});

私の「cookieInjectorファイルは」このサービスには別のサービスが必要であり、同様の方法で実装されています

    define([
  'angularAMD',
  "common/service/cookie-service"
  ], function(angularAMD){
    angularAMD.service("cookieValidator",[function(){
      this.isLoggedIn = false;
      this.getIsLoggedIn = function(){
          return this.isLoggedIn;
      };
      this.setIsLoggedIn = function(status){
          this.isLoggedIn = status;
      };  
    }])
    .factory('cookieInjector', ['$q','cookieValidator', 'cookieService',function($q,cookieValidator,cookieService) {
      var cookieInjector = {
        request: function(config) {
          var cookie = cookieService.getCookie();
          if(!cookie){
            cookieValidator.setIsLoggedIn(false);
            //$location.path('/login');
          }else{
            cookieValidator.setIsLoggedIn(true);
          }
            config.headers['Token'] = cookie ? cookie : null;
            return config;
        },
        response: function(response) {
            response.config.responseTimestamp = new Date().getTime();
            return response;
        },
        responseError: function(response) {
            // Cookie has expired
            if(response.status === 401 || response.status === 403) {
              cookieService.destroyCookie();
              cookieValidator.setIsLoggedIn(false);
            }
            return $q.reject(response);
        }
    };
    return cookieInjector;
  }]);
})

私は完全に立ち往生しています。助けてくれてありがとう。

4

1 に答える 1

1

angularは「cookieInjector」サービスを見つけることができません

これはおそらく、cookieInjectorapp.config の実行時に が利用できないためです。私が覚えていることからangularAMD.factory()、あなたのファクトリー/サービスは、実行された後にのみあなたのアプリに注入されますapp.config()。

したがって、この場合、使用する代わりに別のグローバル角度モジュールを使用する必要がありますangularAMD

ファイルcookieInjector.jsを作成します 

angular.module('cookieModule', []).facotry('cookieInjector', ['$q', 'cookieValidator', 'cookieService', function($q, cookieValidator, cookieService) {
    var cookieInjector = {
        request: function(config) {
            var cookie = cookieService.getCookie();
            if (!cookie) {
                cookieValidator.setIsLoggedIn(false);
                //$location.path('/login');
            } else {
                cookieValidator.setIsLoggedIn(true);
            }
            config.headers['Token'] = cookie ? cookie : null;
            return config;
        },
        response: function(response) {
            response.config.responseTimestamp = new Date().getTime();
            return response;
        },
        responseError: function(response) {
            // Cookie has expired
            if (response.status === 401 || response.status === 403) {
                cookieService.destroyCookie();
                cookieValidator.setIsLoggedIn(false);
            }
            return $q.reject(response);
        }
    };
    return cookieInjector;
}]);

その後、init でアプリを構成できます。

// requireJS config
requirejs.config({
    path:{
        cookieInjector: 'path/to/cookieInjector'
    }
    // ... your codes

    shim: {
        // ... your codes
        // make sure cookie injector only load after angularJS is loaded.
        cookieInjector: ["angular"];
    }
});

// your app.js (?) file
define(["angularAMD", "cookieInjector", "angular-route", "ui-bootstrap", "ngCookies", "common/service/interceptor-service"], function(angularAMD) {
    "use strict";

    var app = angular.module("app", ["cookieModule", "ui.router", "ui.bootstrap", "ngAnimate", "ngTouch", "angular-carousel", "ngCookies"]);

    //route
    app.config(["$stateProvider", "$urlRouterProvider", "$locationProvider", "$httpProvider", function($stateProvider, $urlRouterProvider, $locationProvider, $httpProvider) {
        $urlRouterProvider.otherwise('/');

        $stateProvider
        .state("home", angularAMD.route({

            url: "/",
            views: {

                'header': {
                    /*...*/
                },

            },
            'content': {
                /*...*/
            },

            'footer': {
                /*...*/

            }
        })); 
        // It should be loaded now
        $httpProvider.interceptors.push('cookieInjector');
    }]);


    // Bootstrap Angular when DOM is ready
    return angularAMD.bootstrap(app, false, document.getElementsByTagName("body")[0]);
});
于 2016-02-19T07:23:17.100 に答える