깜놀하는 해므찌로

Angular *ngIf else 활용 예시 본문

IT

Angular *ngIf else 활용 예시

agnusdei1207 2023. 7. 25. 22:46
반응형
SMALL
<ng-container *ngFor="let dot of [].constructor(8); index as i">
    <img
      src="assets\icon\double_circle.svg"
      class="w-4 h-4"
      *ngIf="i === visibleIndex; else none"
    />
    <ng-template #none>
      <div class="bg-white/50 rounded-full w-1.5 h-1.5"></div>
    </ng-template>
  </ng-container>

1. 일반 if else 와 동일하게 동작합니다.

2. else 변수명 : 사용 시 반드시 <ng-template #변수명> 으로 명시해야 하며, ng-template 태그를 사용해야 합니다.

반응형
LIST
저작자표시

'IT' 카테고리의 다른 글

법정동 자료 DB 테이블 생성 및 입력 예시 feat.Navicat 나비캣  (0) 2023.07.27
Angular tailwind floating animation / cloud animation 앵귤러 구름 둥둥 애니메이션 예시  (0) 2023.07.26
Angular floating animation example / 앵귤러 구름 둥둥 애니메이션 앵귤러 애니메이션 파라미터 / angular animation parameter param  (0) 2023.07.24
Angular file Upload 앵귤러 파일 첨부 구현 예시 / Angular Form 활용 예시 email FormGroup  (0) 2023.07.23
Ionic Angular Scroll to Top 앵귤러 페이지 이동 시 스크롤 최상단 배치 예시 feat.smooth  (0) 2023.07.22
'IT' Related Articles more