programing

Angular 템플릿의 인라인 로직JS

abcjava 2023. 4. 6. 20:43
반응형

Angular 템플릿의 인라인 로직JS

Angular에서 템플릿에 인라인으로 로직을 쓸 수 있는 방법이 있습니까?JS.

제가 하고 싶은 일은 다음과 같습니다.

<div ng-repeat="item in items">
    {{item.isValid ? 'Valid item' : 'Invalid Item'}}
</div>

사용할 수 있습니다.&&그리고.||3진 연산자와 동일하게 동작합니다.

{{item.isValid && 'Valid' || 'Invalid' }}

편집: 1.1.5에서 도입된 각도 3진 연산자:

{{item.isValid ? 'Valid' : 'Invalid' }}

ng-show로 스팬을 삽입하여 조건 텍스트를 표시할 수 있습니다.

<div ng-repeat="item in items">
    <span ng-show="item.isValid">
           Valid item
    </span>
    <span ng-show="!item.isValid">
           Invalid item
    </span> 
</div>

각진 표현에는 조건어를 사용할 수 없습니다.또한 div 내용이 가벼운 경우(텍스트만), ng-bind를 사용할 수 있습니다(스팬 요소가 추가되는 일도 없습니다).

<div ng-repeat="item in items" ng-bind="{true: 'Valid item', false: 'Invalid item'}[item.isValid]"></div>

언급URL : https://stackoverflow.com/questions/15409025/inline-logic-in-templates-in-angularjs

반응형