2016-11-24 66 views
0

我在想如果我可以在agular 2組件中使用sass變量。是這樣的:在angular2組件中包含SASS變量

@Component({ 

    selector: 'my-component', 

    template: ` 
    <div> 
     <div class="test-div">test div 1</div> 
    </div> 
    `, 

    styles: [ 
    ` 
    @import "variables"; 

    .test-div{ 
     border: 1px solid $test-color; 
    } 
    `] 

}) 

我的文件_variables.scss:

$test-color: green !default; 

似乎無論我嘗試變量的arent承認的青菜。 任何幫助非常感謝。

回答

0

包括來自單獨文件的樣式。

@Component({ 
    selector: 'app-questions', 
    templateUrl: './questions.component.html', 
    styleUrls: ['./questions.component.scss'], 
}) 

_variables.scss文件添加到組件的文件夾,並在questions.component.scss

@import 'variables'; 

.questions-filter{ 
    a { 
    color: $green; 
    } 
} 

它很適合我導入。

+0

嘿亞歷克斯。感謝您花時間回答這個問題。這是一個對我來說似乎相當不錯的解決方案,它的工作原理。 – TimFelix

+0

沒問題。只要接受這個答案是最好的) –