如何在angular配置中使用变量

Question

我正试图在我的角度代码的配置中动态设置Angular MD主题的颜色.但我似乎无法改变它...我希望primaryPalette在由themeChangerAdjustment触发器更改时更改为变量颜色.

var color = red;

angular.module('myApp', ['ngResource', 'ui.router', 'ui.bootstrap', 'ngMaterial'])
.config(['$mdThemingProvider', function($mdThemingProvider) {
    $mdThemingProvider.theme('default').primaryPalette(color).accentPalette('orange');
}])

.run(['$log','$rootScope', 'themeChangerService', function($log,$rootScope, themeChangerService){
    $rootScope.$on('themeChangerAdjustment', function(){
        alert(themeChangerService.themes.color);
        color = themeChangerService.themes.color; //works
    });
    themeChangerService.prepForAdjustment(1);
}]);

Answer 1

您可以声明一个可在配置块中访问的提供程序，请参阅文档

angular.module('myApp', ['ngResource', 'ui.router', 'ui.bootstrap', 'ngMaterial'])
    .provider('color', function(){
        var color = 'red'
        return {
            value : color,
            $get : function(){
                return {
                    value : color
                };
            }
        };
    })
    .config(function(colorProvider){
        console.log('color in config :',colorProvider.value);
        //you config here
    })
    .controller('myCtrl',function(color){
        console.log('color in ctrl :', color.value);
    });

请参阅此处的 JSFiddle 演示