2017-12-14 7 views
0

작동하지, 내가 가진 :각 물질 테마 config 블록에서

.config(['$urlRouterProvider', '$stateProvider', '$locationProvider', '$mdThemingProvider', function ($urlRouterProvider, $stateProvider, $locationProvider, $mdThemingProvider) { 


    $locationProvider.html5Mode(true); 

    $urlRouterProvider.otherwise('/'); 

    $mdThemingProvider.theme('altTheme') 
     .primaryPalette('pink', { 
     'default': '400', // by default use shade 400 from the pink palette for primary intentions 
     'hue-1': '100', // use shade 100 for the <code>md-hue-1</code> class 
     'hue-2': '600', // use shade 600 for the <code>md-hue-2</code> class 
     'hue-3': 'A100' // use shade A100 for the <code>md-hue-3</code> class 
     }) 
     .accentPalette('purple', { 
     'default': '200' // use shade 200 for default, and keep all other shades the same 
     }); 

    $mdThemingProvider.setDefaultTheme('altTheme'); 
    $mdThemingProvider.alwaysWatchTheme(true); 

HTML에서 :

<header> 
    <md-toolbar class="md-hue-1"> 
    <div layout="row" layout-align="center center" flex> 
     Beauty Plus Marketing 
    </div> 
    </md-toolbar> 
</header> 

그러나, 적용된 배경이 없습니다.

여기에 내가 브라우저에서보고하고있는 스타일이다 :

md-toolbar.md-altTheme-theme.md-hue-1:not(.md-menu-toolbar) { 
    background-color: rgb(248,187,208); 
    color: rgba(0,0,0,0.87); 
} 

<style>…</style> 
md-toolbar.md-altTheme-theme:not(.md-menu-toolbar) { 
    background-color: rgb(236,64,122); 
    color: rgba(255,255,255,0.87); 
} 

내가 정자를 사용하여 각 재료를 설치하지만 여기에 잘못 아무것도 here.Am I 작업 테마의 CSS 부분이 표시되지 않는 이유는 무엇입니까?

답변

1

index.html 파일의 css 파일 경로를 잊어 버린 것 같습니다.

<html> 
<head> 
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no" /> 
    <link rel="stylesheet" href="/bower_components/angular-material/angular-material.css"> 
</head> 
    <body ng-app="YourApp"> 

    <div ng-controller="YourController"> 

    </div> 

    <script src="/bower_components/angular/angular.js"></script> 
    <script src="/bower_components/angular-aria/angular-aria.js"></script> 
    <script src="/bower_components/angular-animate/angular-animate.js"></script> 
    <script src="/bower_components/angular-material/angular-material.js"></script> 
    <script> 

     // Include app dependency on ngMaterial 

     angular.module('YourApp', [ 'ngMaterial' ]) 
      .controller("YourController", YourController); 

    </script> 

</body> 
</html> 

당신은뿐만 아니라이 링크를 참조 할 수 있습니다 : 내 나쁜 https://github.com/angular/bower-material

+0

합니다. 나는 .scss 경로를 추가했다. 나는 놀랍다. 작동하지 않았다. –

+0

지금 작동 중입니까? –

+1

예 :) 고마워요! –