首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >创建在angular .config()中使用的提供程序

创建在angular .config()中使用的提供程序
EN

Stack Overflow用户
提问于 2015-09-29 06:30:33
回答 2查看 810关注 0票数 0

我正在尝试创建一个在.config()中使用的提供程序,但不知道哪里出错了,因为这是我第一次创建提供程序。

实际上我想返回CacheFactory提供程序的结果。有一个工厂已经工作,但由于在配置中不接受工厂,我有这个问题。

代码语言:javascript
复制
.factory('_CONFIG', ['$cacheFactory', function($cacheFactory) {
    return $cacheFactory('config_global');
}])

.provider('__CONFIG', function($cacheFactory) {
    var _cache = $cacheFactory('config_global');
    return {
        $get: function(key) {
            return _cache.get(key);
        }
    };
});

我想在这里使用:

代码语言:javascript
复制
.config(['$mdThemingProvider', function ($mdThemingProvider, __CONFIGProvider) {
    'use strict';

    var themes = __CONFIGProvider.get('config');

    if(themes.themes_dark) {
        $mdThemingProvider.theme('default')
            .dark()
            .primaryPalette('blue', {
                'hue-1'   : '700',
                'hue-2'   : '600',
                'hue-3'   : '500'
            })
            .accentPalette('pink');
    }
    else {
        $mdThemingProvider.theme('default')
            .primaryPalette('blue', {
                'hue-1'   : '700',
                'hue-2'   : '600',
                'hue-3'   : '500'
            })
            .accentPalette('pink');
    }

}])

新的柱塞:http://plnkr.co/edit/RVK8EwoyOQNka5E84jSg?p=preview

EN

回答 2

Stack Overflow用户

发布于 2015-10-01 00:27:42

代码语言:javascript
复制
angular.module('app',[
    'ngAnimate',
    'ngAria',
    'ngMaterial'
])

.provider('__CONFIG', function() {

    var config = this;

    //Config manipulations
    (function(){
    config.themeselect = [
        {name: 'Blue', value: 'blue'},
        {name: 'Light Blue', value: 'light-blue'},
        {name: 'Indigo', value: 'indigo'},
        {name: 'Pink', value: 'pink'},
        {name: 'Teal', value: 'teal'},
        {name: 'Lime', value: 'lime'},
    ];

    config.themes_primary = 'indigo';
    config.themes_accent = 'pink';  
    })()


    return {
      //This will be seen by the config function
      primary:function(){return config.themes_primary;},
      accent:function(){return config.themes_accent;},
        //Get is being seen by controllers
        $get: function(){
          return {
            primary: function(){
              return config.themes_primary;
            },
            accent: function(){
              return config.themes_accent;
            },
            themeselect:config.themeselect
          }
    }
  };
})

.controller('Themes', function(__CONFIG){
  var vm = this;
  vm.themeselect = __CONFIG.themeselect;

})



.config(['$mdThemingProvider','__CONFIGProvider', function ($mdThemingProvider, __CONFIGProvider) {
    'use strict';

    var primary = __CONFIGProvider.primary(),
        accent = __CONFIGProvider.accent();

        console.log(primary);

    $mdThemingProvider.theme('default')
        .primaryPalette(primary)
        .accentPalette(accent);

    $mdThemingProvider.alwaysWatchTheme(true);

}])
代码语言:javascript
复制
<script data-require="angular.js@1.4.3" data-semver="1.4.3" src="https://code.angularjs.org/1.4.3/angular.js"></script>
<script src="https://code.angularjs.org/1.4.3/angular-animate.js" data-semver="1.4.3" data-require="angular-animate@1.4.3"></script>
<script data-require="angular-aria@1.4.3" data-semver="1.4.3" src="https://code.angularjs.org/1.4.3/angular-aria.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-material/0.11.1/angular-material.min.js" data-semver="0.10.1" data-require="angular-material@*"></script>
<script src="script.js"></script>

代码语言:javascript
复制
<div layout="column" layout-fill>

<md-toolbar class="md-primary">
    <div class="md-toolbar-tools admin-toolbar-tools" ng-click="openMenu()" tabIndex="-1">

        <div layout="row" flex class="fill-height">
            <h2 class="md-title">Themes</h2>
        </div>
    </div>

</md-toolbar>
<md-content ng-controller="Themes as vm" layout-padding>



  <md-input-container class="md-accent">
        <label>Selecione o Tema Primário</label>
        <md-select name="themes_primary" ng-model="themes_primary" placeholder="Selecione o Tema Primário" class="md-accent">
            <md-option ng-repeat="theme in vm.themeselect" value="{{theme.value}}" class="md-accent" md-theme-watch>{{theme.name}}</md-option>
        </md-select>
    </md-input-container>

    <md-input-container class="md-accent">
        <label>Selecione o Tema Primário</label>
        <md-select name="themes_accent" ng-model="themes_accent" placeholder="Selecione o Tema Accent" class="md-accent">
            <md-option ng-repeat="theme in vm.themeselect" value="{{theme.value}}" class="md-accent" md-theme-watch>{{theme.name}}</md-option>
        </md-select>
    </md-input-container>

    <md-button class="md-raised md-accent">Theme Apply</md-button>
    <md-button class="md-raised">CANCEL</md-button>




</md-content>
</div>

票数 1
EN

Stack Overflow用户

发布于 2015-09-29 10:19:50

代码语言:javascript
复制
    .config([
    '$mdThemingProvider',
    /*!~~!!missed Me!!~~!*/
    '__CONFIGProvider',//<-------------------- 
function ($mdThemingProvider, __CONFIGProvider)

  1. 这两个代码文件是同一个模块的一部分吗?(angular.module...)如果没有,请检查提供程序的模块是否列在配置模块的dep注入中。
  2. 检查提供程序是否出现在索引文件中的配置文件之前或之后。
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/32832821

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档