2017-11-02 1 views
3

임 (2 스타일 시트)을 토글하는 것이 가능한지 궁금합니다. 내 실제 설정은 내 angular-cli.json 설정 내 스타일 시트 A입니다. 스타일 시트 B를 스타일 시트 B를 간단한 (클릭) 토글러로 대체하는 것이 무엇을하고 싶습니다.각도 4 각형 안쪽에 스타일 쉬트 토글

나는이

구성 요소처럼 보일 것 index.html을 코드에서 스타일 시트를 가져올 것인지 :

constructor() { } 

    toggleTheme() { 
    this.darkTheme = this.lightTheme; 
    } 

Index.html을

<div [class.dark]="darkTheme"> 
<div [class.light]="lightTheme"> 
<button (click)="toggleTheme()"> 
Toggle theme 
</button> 

하지만 메신저 이후 스타일 시트 가져 오기 dark.css를 index.html 대신에 angular-cli.json 파일에 넣으십시오. 어떻게 해결할 수 있습니까?

답변

0

각 구성 요소에는 각자의 스타일 시트 파일이 있으며 범위는 구성 요소에만 적용됩니다. 인덱스 파일에서 기본 스타일 시트를 변경하고 싶지만 각도 구성 요소 이후 변경 될 컨텍스트 또는 범위가 없습니다.

주 구성 요소에서 (공유 레이아웃으로)이 작업을 수행 할 수 있습니다. 그러나 모든 자식 구성 요소에는 스타일 시트 범위가 없다는 것을 기억하십시오.

+0

내가 해결할 수있는 것이 무엇입니까? 예를 들어 @import 문을 사용하여 글로벌 CSS에 가져 오면 어떻게 될까요? – Escobar