AngularJS
constanten

Opmerkingen

Maak je eerste constante

angular
  .module('MyApp', [])
  .constant('VERSION', 1.0);

Je constante is nu gedeclareerd en kan worden geïnjecteerd in een controller, een service, een fabriek, een provider en zelfs in een configuratiemethode:

angular
  .module('MyApp')
  .controller('FooterController', function(VERSION) {
    this.version = VERSION;
  });

<footer ng-controller="FooterController as Footer">{{ Footer.version }}</footer>

Gebruik cases

Er is hier geen revolutie, maar hoekconstante kan vooral handig zijn wanneer uw applicatie en / of team begint te groeien ... of als u gewoon van het schrijven van mooie code houdt!

• Refactor code. Voorbeeld met namen van evenementen. Als je veel evenementen in je applicatie gebruikt, heb je overal een beetje namen voor evenementen. Als een nieuwe ontwikkelaar bij je team komt, geeft hij zijn evenementen een andere syntaxis, ... Je kunt dit eenvoudig voorkomen door de namen van je evenement in een constante te groeperen:

  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() {
        ...
      });
    })
  

... en nu kunnen de namen van je evenement profiteren van autocompletion!

• Definieer configuratie. Zoek al uw configuratie op dezelfde plaats:

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

• Onderdelen isoleren. Soms zijn er dingen waar je niet erg trots op bent ... zoals hardcoded waarde bijvoorbeeld. In plaats van ze in uw hoofdcode te laten, kunt u een hoekconstante maken

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

... en refactor zoiets

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

naar

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