angular.js - $mdThemingProvider 不能在controller中使用吗
高洛峰
高洛峰 2017-05-15 16:56:08
0
2
752

.config(CoreTheme)

function CoreTheme($mdThemingProvider) {
    $mdThemingProvider.theme('default')
        .primaryPalette('blue',{
            'default'   :   '500',
            'hue-1'     :   '900',
            'hue-2'     :   'A100',
            'hue-3'     :   '400'
        })
        .accentPalette('green',{
            'default'   :   '600',
            'hue-1'     :   '900',
            'hue-2'     :   'A100',
            'hue-3'     :   '400'
        })
        .warnPalette('deep-orange',{
            'default'   :   '500',
        });
    $mdThemingProvider.alwaysWatchTheme(true)
}

CoreTheme.$inject = ['$mdThemingProvider'];

export default CoreTheme;

module.js

export default angular.module('theme',['ngMaterial']);

controller.js

class ThemeCtrl{
    constructor($scope,$rootScope,$mdThemingProvider){
   
        $scope.changeTheme = changeTheme;


        function changeTheme(theme_name){
            $mdThemingProvider.theme('default').dark()
        }
    }
}

ThemeCtrl.$inject = ['$scope','$rootScope','$mdThemingProvider'];

export default ThemeCtrl;

我想在这个控制器中 动态改变主题样式 可是注入这个Provider报错!应该怎么做?
我能想到的是(1)可以在.config()中$watch某个变量 来改变主题吗?

高洛峰
高洛峰

拥有18年软件开发和IT教学经验。曾任多家上市公司技术总监、架构师、项目经理、高级软件工程师等职务。 网络人气名人讲师,...

全員に返信(2)
给我你的怀抱

参考質問
最新の素材ソースコードを見てみましたが、以下の方法を使用したい場合は、やはり素材ソースコードを修正する必要があるようです。ソースコードを変更しない場合は、この回答を無視してください。

次のように試すことができます:
1. 参考質問の回答に従って資料のソースコードを変更します

2. 設定フェーズで、コントローラー用に $mdThemingProvider を登録します

リーリー

3. コントローラーでテーマをリロードします

リーリー
いいねを押す +0
曾经蜡笔没有小新

Configuring of the default theme is done by using the $mdThemingProvider during application configuration.
公式サイトには、configurationで設定してくださいと書かれていました。

angular マテリアルには、ページ生成時にテーマがすでに与えられています。 たとえば、md-button が生成されると、それは md-button md-default-theme になります。 テーマを変更したい場合は、ページを移動して、md-default-theme を目的のテーマ md-dark-theme に置き換えます。

でも、これをやるのは面倒ですよね?

したがって、テーマを選択した後、新しいウィンドウでプレビューを開くのが最善です。
または、すべてのテーマがどのようなものかをリストする別のテーマ ページを用意します。 ただオプションを持ってください。結局のところ、元の Web サイトでインターフェイスをプレビューするのは非常に面倒なことです。

いいねを押す +0
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート