I am developing an Angular JS application. I would like to know what is the best practice to include string values in our code.

I am planning to use another JS File which contains all the constant values. I will call this JS file in each and every JS(Controller) to refer the string values.

I am developing an Angular JS application. I would like to know what is the best practice to include string values in our code.

I am planning to use another JS File which contains all the constant values. I will call this JS file in each and every JS(Controller) to refer the string values.

• javascript
• jquery
• angularjs
• string

• check this stackoverflow./questions/5786054/… – Frebin Francis Commented Feb 27, 2015 at 7:07
• You could store them in a JSON file and grab this via AJAX, when needed. – royhowie Commented Feb 27, 2015 at 7:08

5 Answers 5

You can define constants in angular like

angular.module('moduleName',[]).constant('constName',string|object|array);

You can inject in directive or controller or wherever you want.

angular.module('moduleName',[]).directive('directiveName', ['constName', function(constName){...});

You have several options.

Global value. You can use your constants in form of the javascript object which would be globally accessible across the application. For example, your file could look something like this:

config = {
    host: 'domain',
    port: '1234' 
};

Obvious disadvantage is that those values are not really a constants and can be easily changed, so it's error prone.

Angular config module. More reliable and cleaner option is to create a separate module to be used as a dependency for main app module. You would still have separate file for your constants but instead of some global variable this file would hold angular module with constant service. Something like this:

angular.module('app.config', []).constant('config', {
    host: 'domain',
    port: '1234'
});

Then in main application you would configure app like

angular.module('app', ['app.config']).config(function(config) {
    // console.log(config);
});

Here is the sample code;

var app = angular.module('plunker', []);

app.constant('configs', {host:'localhost',port:8080});
app.controller('MainCtrl', function($scope, configs) {
  $scope.name = configs.host;
});

here is demo plunker

Angular has a built in way of providing constants, e.g:

angular.module('foo', ['ngRoute']) // Your angularjs module

// Decide a name for the bucket of constants, then just declare the
// constants in turn as an object literal:
.constant("HTTP_CONSTANTS", {
    "URL": "http://localhost",
    "PORT": "80"
})

Then you can load it anywhere where you have access too you foo module using dependency injection, i.e.:

angular.module('foo')

.controller('bar', function (HTTP_CONSTANTS) {
    ... // Use HTTP_CONSTANTS.URL or HTTP_CONSTANTS.PORT, for example
})

Here's a good primer on using constants:

http://twofuckingdevelopers./2014/06/angularjs-best-practices-001-constants/

You can use factory for this purpose and inject this factory where ever you want these constants.

 var app=angular.module('Myapp', []);

    app.factory('ConstantService', function(){
      var constant={temp:'c'}; 
      var getConstants=function(){
       return constant;
          };
     return{
        constants:getConstants;
      }
    });

    app.controller('MyController',['ConstantService' function (ConstantService){
    var constant= ConstantService.constants;
    }]);