如何在angular配置中使用变量

I'm trying to dynamicly set the color of the Angular MD theme in the config of my angular code. But I can't seem to change it... I want the primaryPalette to change to the variable color when it's changed by the themeChangerAdjustment trigger.

我正试图在我的角度代码的配置中动态设置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);
}]);

1 个解决方案

#1

You can declare a provider that will be accessible in the config block, see doc

您可以声明可在配置块中访问的提供程序,请参阅doc

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);
    });

see JSFiddle demo here

在这里看JSFiddle演示

#1