AngularJS ng-class지시문


예시

<div> 요소의 클래스 변경:

<select ng-model="home">
    <option value="sky">Sky</option>
    <option value="tomato">Tomato</option>
</select>

<div ng-class="home">
    <h1>Welcome Home!</h1>
    <p>I like it!</p>
</div>

정의 및 사용

지시문 은 ng-class하나 이상의 CSS 클래스를 HTML 요소에 동적으로 바인딩합니다.

지시어 의 값은 ng-class문자열, 개체 또는 배열일 수 있습니다.

문자열인 경우 공백으로 구분된 하나 이상의 클래스 이름을 포함해야 합니다.

객체로서 키-값 쌍을 포함해야 합니다. 여기서 키는 추가하려는 클래스의 클래스 이름이고 값은 부울 값입니다. 값이 true로 설정된 경우에만 클래스가 추가됩니다.

어레이로서 둘의 조합이 될 수 있습니다. 각 배열 요소는 위에서 설명한 대로 문자열 또는 개체일 수 있습니다.


통사론

<element ng-class="expression"></element>

모든 HTML 요소에서 지원됩니다.


매개변수 값

Value Description
expression An expression that returns one or more class names.