AngularJS ngClass에서 조건식을 어떻게 사용할 수 있나요?

AngularJS ngClass의 조건식

AngularJS ngClass 지시문을 사용하면 부울 표현식을 기반으로 HTML 요소에 CSS 클래스를 조건부로 적용할 수 있습니다. 표현식을 조건부로 만들려면 다음 구문을 사용할 수 있습니다.

ng-class="{test: condition}"

여기서 조건은 true 또는 false로 평가되는 JavaScript 표현식입니다.

예:

속성 value1이 'someothervalue'로 설정된 객체 obj가 있다고 가정합니다. 다음 ngClass 표현식을 사용하여 CSS 클래스 'test'를 요소에 조건부로 적용할 수 있습니다.

<span ng-class="{test: obj.value1 == 'someothervalue'}">test</span>

obj.value1이 'someothervalue'와 같으면 'test' 클래스가 요소에 적용됩니다. .

참 표현과 거짓 표현:

ngClass 지시문은 표현식을 '참' 또는 '거짓' 값으로 평가합니다. 실제 값(예: 'true', '1', 'yes')은 클래스를 적용하고, 거짓 값(예: 'false', '0', 'no')은 클래스를 적용하지 않습니다.

복잡한 표현식:

조건 논리가 너무 복잡해지면 다음을 반환하는 함수를 사용할 수 있습니다. 참 또는 거짓 값.

예:

<span ng-class="{test: checkValue1()}">test</span>

$scope.checkValue1 = function() {
  return $scope.obj.value === 'somevalue';
}

논리 표현식:

논리 연산자를 사용하여 다음을 수행할 수도 있습니다. 논리식을 형성하다 ngClass.

예:

ng-class="{'test': obj.value1 == 'someothervalue' || obj.value2 == 'somethingelse'}"

이 표현식은 obj.value1이 'someothervalue'와 같거나 obj.value2가 다음인 경우 'test' 클래스를 적용합니다. '다른 것'과 같습니다.

위 내용은 AngularJS ngClass에서 조건식을 어떻게 사용할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!