null로 렌더링 된 범위 변수를 포함하는 ng-class 클래스 이름

Question

특정 범위 변수를 기반으로하는 클래스를 사용하는 클래스가 있습니다. 의 값을 취 이때

이 범위 변수 인 {{}} jobSingle.UserFit.Summary.score -1 (알려지지 않은 경우) 또는 0-10 (점수 알려진다).

스팬은 다음 코드로 렌더링됩니다.

<span ng-class="{true: 'fit-score-{{jobSingle.UserFit.Summary.score * 10}}', false: 'fit-score-unknown'}[jobSingle.UserFit.Summary.score > -1]"> 
    [Content] 
</span> 

그러나 jobSingle.UserFit.Summary.score> -1 인 경우 클래스가 올바르게 채워지지 않습니다.

개발자 콘솔에서 요소를 검사하면 코드가 그대로 표시됩니다.

<span class="fit-score-null" ng-class="{true: 'fit-score-70', false: 'fit-score-unknown'}[jobSingle.UserFit.Summary.score > -1]"> 
    [Content] 
</span> 

스팬 렌더링 된 클래스

'는 끼워 맞춤 score- 널 '이다.

다른 어떤 배경 정보 :

위의 코드 내가 로컬로 정의 된 모의 데이터를 사용하여 때를 작동하는 데 사용 .

그러나 $ http을 사용하여 API에서 실제 데이터를 호출하도록 컨트롤러를 전환 한 후 위의 상황에서 내 클래스 이름에 null이 표시되기 시작했습니다.

위의 데이터를 제외한 다른 모든 데이터는 완벽하게 렌더링됩니다.

내가 잘못 했나요? 미리 감사드립니다.

Answer 1

각도 버전 속성 내부에서 이미 값을 평가할 것이기 때문에 ({{및}} 사용) 평가해서는 안됩니다. 'fit-score-'와 같이 이미 문자열로 평가할 것입니다. 대신 사용해보십시오

ng-class="{true : 'fit-score-' + (jobSingle.UserFit.Summary.score * 10), false : ...