AngularJS - ng-class에서 복수 회의 사용하기

나는 ng-repeat를 사용합니다. 또한 작동중인 ng-class true/false 조건이 있습니다. 내 진실/거짓 진술에 다른 조건을 추가 할 수 있습니까?AngularJS - ng-class에서 복수 회의 사용하기

<tr ng-repeat="data in myData" ng-class="{true: 'green', false: 'red'}[data.IsPositive]"> 
    <td> 
     {{data.Name}} 
    </td> 
    <td> 
     {{data.CompanyName}} 
    </td> 
    <td> 
     <span ng-show="data.Date | lessThanOneYear">Less than one year</span> 
     <span ng-show="data.Date | lessThanOneYear">Greater than one year</span> 
    </td> 
</tr>

는 기본적으로 난 경우에 검사를 수행 할 : 위의 모두에 해당하면

ng-class="[data.IsPositive] and [data.Date | lessThanOneYear]

그래서, false의 경우, ... CSS 클래스는 녹색 적용, 붉은 적용됩니다.

솔루션 : 내가 제공 한이 개 제안의 혼합물을 사용 했어

. 기본적으로 필터와 조건이 너무()에 싸여 될 필요가 :

ng-class="[data.IsPositive && (data.Date | lessThanOneYear)]

출처

2014-10-24 Oam Psy

중복? http://stackoverflow.com/questions/18871277/adding-multiple-class-using-ng-class –

@MarioLevrero 나는 그렇게 생각하지 않는다. 더 복잡한 부울 표현을 묻습니다. 그는 ng-class 식으로 더 많은 클래스를 사용하는 것에 대해 묻지 않습니다. – BiAiB

@BiAiB, 물론 사실입니다. 내 잘못. –

이렇게하면 [] 사이의 식을 평가해야한다는 것을 이해할 필요가있다 연관 배열 {true: 'green', false: 'red'}에 지정한 인덱스 중 하나에 매핑합니다.

그러면 true 또는 false로 평가되는 표현식을 사용할 수 있습니다.이 경우 모든 부울 표현식이 사용될 수 있습니다.

[data.IsPositive and data.Date | lessThanOneYear]

출처

2014-10-24 08:39:00 yunandtidus

상기 용액을 첨가 하였다. –

다음과 같아야합니다 :'{true : 'green', false : 'red'} [data.IsPositive and data.Date | lessThanOneYear]' – yunandtidus

그래, 당신은 할 수 있습니다

{true: 'green', false: 'red'}[data.IsPositive && secondCondition && x>3 && whatever]

출처

2014-10-24 08:35:48 BiAiB

상기 용액을 첨가 하였다. –

AngularJS - ng-class에서 복수 회의 사용하기

답변

관련 문제