Globally configuring Angular directives

Question

Some of the Angular UI Bootstrap directives, such as datepicker, have configuration instructions like this: "All settings can be provided as attributes in the <datepicker> or globally configured through the datepickerConfig."

Although the configuration options are listed, there is no description of what a *Config is and how I globally configure one. It sounds like this is a standard part of Angular. Is it? How do I use this configuration pattern, and where is it documented?

I do believe, it's implemented as simple setting service(factory) and directive has dependency onto it — Eugene P., Feb 14 '14 at 17:46

score 23 · Accepted Answer · edited Apr 21 '17 at 18:59

23

Something like this:

angular.module('myModule', ['ui.bootstrap'])

.config(['uibDatepickerConfig', function(uibDatepickerConfig) {
    uibDatepickerConfig.showWeeks = false;
}]);

edited Apr 21 '17 at 18:59

George

4,323
3
30
33

answered Feb 14 '14 at 18:24

Gruff Bunny

27,738
10
72
59

2

That is wrong because as Eugene pointed out in bootstrap ui the uibDatepickerConfig is implemented as a simple service instead of using the provider stuff: https://github.com/angular-ui/bootstrap/blob/master/src/datepicker/datepicker.js – arturh Nov 03 '15 at 10:41
@arturh uibDatepickerConfig isn't a service. The angular UI docs state: "Also, some components have default values that you can override globally within a .config function for example." – Gruff Bunny Nov 03 '15 at 10:51

score 1 · Answer 2 · answered Feb 15 '14 at 02:48

1

The reference documentation for using config is in the Angular.Module type under the config method. However, that documentation doesn't tell you how config works. For an overview, look in the Developer Guide under Provider Recipe.

answered Feb 15 '14 at 02:48

Edward Brey

40,302
20
199
253

Globally configuring Angular directives

2 Answers2

Linked