AngularJS Use cases


Example

There is no revolution here, but angular constant can be useful specially when your application and/or team starts to grow ... or if you simply love writing beautiful code!


  • Refactor code. Example with event's names. If you use a lot of events in your application, you have event's names a little every where. A when a new developper join your team, he names his events with a different syntax, ... You can easily prevent this by grouping your event's names in a constant:

    angular
      .module('MyApp')
      .constant('EVENTS', {
        LOGIN_VALIDATE_FORM: 'login::click-validate',
        LOGIN_FORGOT_PASSWORD: 'login::click-forgot',
        LOGIN_ERROR: 'login::notify-error',
        ...
      });
    
    angular
      .module('MyApp')
      .controller('LoginController', function($scope, EVENT) {
        $scope.$on(EVENT.LOGIN_VALIDATE_FORM, function() {
          ...
        });
      })
    

... and now, your event's names can take benefits from autocompletion !


  • Define configuration. Locate all your configuration in a same place:

    angular
      .module('MyApp')
      .constant('CONFIG', {
        BASE_URL: {
          APP: 'http://localhost:3000',
          API: 'http://localhost:3001'
        },
        STORAGE: 'S3',
        ...
      });
    

  • Isolate parts. Sometimes, there are some things you are not very proud of ... like hardcoded value for example. Instead of let them in your main code, you can create an angular constant

    angular
      .module('MyApp')
      .constant('HARDCODED', {
        KEY: 'KEY',
        RELATION: 'has_many',
        VAT: 19.6
      });
    

... and refactor something like

$scope.settings = {
  username: Profile.username,
  relation: 'has_many',
  vat: 19.6
}

to

$scope.settings = {
  username: Profile.username,
  relation: HARDCODED.RELATION,
  vat: HARDCODED.VAT
}