[AngularJS] ng-style 사용하기

 

[AngularJS] ng-style 사용법

 

 

 

 

AngularJS 에서 제공하는 ng-style!

 

일단 AngularJS 공식문서에 따르면, ng-style 은 조건적으로 CSS style을 입힐 수 있는 directive 다.

 

 

 

 

보통 css를 따로 쓰지만, 때에 따라 inline 형식으로 직접 DOM에 style을 명시할 때 유용하다.

간단하게 정리하자

 

 

 

 

---

 

[예시]

 

<div ng-style="{'background-color' : giftCd == '1' ? 'black' : 'gray'}">
       <span ng-style="{'color' : isTrue?'green' : 'red'}">{{yourGift}}</span>
</div>

 

 

---

 

 

1) 위의 div 에 명시한 것처럼 (giftCd == 1) 이면 배경색을 black으로, 아니면 gray로!

 

 

2) span 에 명시한 것처럼 그냥 flag 값이 true면 green 으로, false면 red 로! 

 

 

 

 

 

 

 

 

 

 

 

 

class 를 동적으로 입히고 싶다면?

https://devinserengeti.tistory.com/4?category=901018

[AngularJS] ng-class 를 사용하여 동적으로 class 넣기