Dynamic constants within AngularJs

Question

For anyone with deeper knowledge of constants is it possible to somehow assign it dynamically?

I know this is a silly question but up to this point I have been using a constant to define a parameter:

myApp.constant('Groupid', 10);

While this works fine in development in production this parameter will change based on the group. Luckily this can be determined before, at, or during module initialization.

So, I was thinking something that would be able to set this parameter in the .run() or .config() operation or just .constant('Groupid', function(){}). But the latter doesn't work becuase constant only accepts a value/object as its second argument.

As the only alternative that can see I could use a directive but it would be evaluated way too many times unnecessarily between all service calls. While it is a fairly light and static function but still to be called so many times... I'd prefer a constant assignment.

Is that just something I have to live with for the time being or there is light at the end of the tunnel?

In Addition

Just as I posted this question another idea came to mind. Is it possible to pass in a custom value/object from outside into .module?

var cusObj = { GroupId: getGroupId(), };
var myApp = angular.module('myApp', ['ui.router', 'ngResource', 'cusObj']);

Touhid Alam · Accepted Answer · 2015-07-14 09:32:08Z

3

Providers allow complex creation function and configuration options. A provider is actually a configurable factory. The provider accepts an object or a constructor. You can read about all the options here

app.provider('movie', function () {
    var version;
    return {
        setVersion: function (value) {
            version = value;
        },
        $get: function () {
            return {
                title: 'The Matrix' + ' ' + version
            }
        }
    }
});

app.config(function (movieProvider) {
    movieProvider.setVersion('Reloaded');
});

answered Jul 14, 2015 at 9:32

Touhid Alam

3431 silver badge5 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

iiminov Over a year ago

Certainly that looks like it will also do the trick. Thanks for the info and link to a very good post.

Tom Spencer · Accepted Answer · 2016-09-02 14:10:06Z

3

In addition to the accepted answer I'd like to share my own use case, setting a value based on the $window.location.origin. In my app, I need to prefix an ID returned from the server with this base URL value, so that the resultant link ${base_url}/${id} works in both development and production environments.

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

app.config(function ($provide, $windowProvider) {
  var $window = $windowProvider.$get();
  $provide.value('originUrl', $window.location.origin);
  // `originUrl` is set according to the server
  // that has served up the code
});

app.controller('MyController', function (originUrl) {
  expect(originUrl).toEqual('http://localhost:8080'); // e.g. for development
  expect(originUrl).toEqual('http://mysuperapp.com'); // e.g. for production
});

answered Sep 2, 2016 at 14:10

Tom Spencer

8,0974 gold badges58 silver badges51 bronze badges

1 Comment

iiminov Over a year ago

That look interesting. Will give it a shot when I get a good use case for this.

ngLover · Accepted Answer · 2015-07-14 08:31:40Z

1

A decorator can modify or encapsulate other providers. There is one exception and that a constant cannot be decorated. so you can use value from angular.

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

app.value('movieTitle', 'The Matrix');

app.config(function ($provide) {
  $provide.decorator('movieTitle', function ($delegate) {
    return $delegate + ' - starring Keanu Reeves';
  });
});

app.controller('MyController', function (movieTitle) {
  expect(movieTitle).toEqual('The Matrix - starring Keanu Reeves');
});

answered Jul 14, 2015 at 8:31

ngLover

4,6183 gold badges24 silver badges42 bronze badges

2 Comments

iiminov Over a year ago

Strange I seems to be having difficulty getting this to work with ui.router resolve property. I need to do a bit more testing with this.

iiminov Over a year ago

OK, the cause seems to be resolved. Typo on my side. Thank you very much that certainly did the trick.

Collectives™ on Stack Overflow

Dynamic constants within AngularJs

In Addition

3 Answers 3

1 Comment

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

In Addition

3 Answers 3

1 Comment

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related