CODEWITHSUNDEEP
javascriptangularjsangular-services
el.severo
el.severo

Reputation: 2277

angularjs include another module in a service

I want to include another module into my service, I have some constants / config related. My config module looks like:

angular.module('myApp.config', [])
  .constant('EnvironmentConfig', {
    "WindowsAzureADConfig": {
      "tenant": "aaa.onmicrosoft.com", 
      "clientAppId": "xx-xx-xx-xx-xx", 
      "authority": "https://login.windows.net/aa.onmicrosoft.com", 
      "resourceUrl": "https://graph.windows.net/", 
      "redirectUrl": "http://localhost:4400/services/aad/redirectTarget.html"
    }, 
    "AppEndPointConfig": {
      "tokenAccess": "aa-aa-a-a-aa", 
      "baseURL": "http://aa.aaa.aa/api/", 
      "paths": {
        "bpath": "bpath/"
      }
    }, 
    "PConfig": {
      "ApiKey": "aaadd2dasdasdas23f44ffsfsdf", 
      "printerId": 244312
    }
  }
);

I have the following angularjs service:

(function () {
  function MySrv(EnvironmentConfig) {
    var mySrv = {};
    var app = {
      aFunction: function () {
        console.log(EnvironmentConfig.authority); // getting undefined
      }
    };
    mySrv.app = app;

    return mySrv;
  }

  angular
    .module('myApp') // if adding .module('myApp', ['myApp.config']) then I'm getting a blank screen
    .service('MySrv', mySrv);
})();

Note that the module is included & defined before the service itself.

Upvotes: 0

Views: 705

Answers (2)

Manoj Shevate
Manoj Shevate

Reputation: 742

authority is inside the object property WindowsAzureADConfig, so you need to update the log method.

refer below working code snippet with module dependency injection

angular.module('myApp.config', [])
    .constant('EnvironmentConfig', {"WindowsAzureADConfig":{"tenant":"aaa.onmicrosoft.com","clientAppId":"xx-xx-xx-xx-xx","authority":"https://login.windows.net/aa.onmicrosoft.com","resourceUrl":"https://graph.windows.net/","redirectUrl":"http://localhost:4400/services/aad/redirectTarget.html"},"AppEndPointConfig":{"tokenAccess":"aa-aa-a-a-aa","baseURL":"http://aa.aaa.aa/api/","paths":{"bpath":"bpath/"}},"PConfig":{"ApiKey":"aaadd2dasdasdas23f44ffsfsdf","printerId":244312}});



(function() {

      function MySrv(EnvironmentConfig) {

        var mySrv = {};

        var app = {
        aFunction: function() {
          console.log(EnvironmentConfig.WindowsAzureADConfig.authority); // authority is inside the object property WindowsAzureADConfig, so you need to update the log method
        }
        };

        mySrv.app = app;

        return mySrv;
        }

    angular
    .module('myApp',['myApp.config']) // this is the way to add dependency in module
    .controller('myController', function($scope, MySrv){
        $scope.aFunction = function(){
            MySrv.app.aFunction();
        }
    })
    .service('MySrv',MySrv)
    

    })();
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="myApp">
<div ng-controller="myController">
    <a ng-click="aFunction()">Click here</a>
</div>
</body>

Hope this Helps!

Upvotes: 0

bregnvig
bregnvig

Reputation: 71

You cannot re-declare a module, and you do that when you

.module('myApp', ['myApp.config'])

So as Gustav says, you either include the myApp.config where you declared the myApp the first time, or you put your service in a module of its own, like you did with the myApp.config.

.module('myApp.service', ['myApp.config'])

But then you need to include the service module into your myApp module. Like this:

.module('myApp', ['myApp.service'])

Since the service module includes the config module, you don't need to include it in the myApp module

Upvotes: 1

Related Questions