깜놀하는 해므찌로

Angular ngFor last 활용 예시 isLast 본문

IT

Angular ngFor last 활용 예시 isLast

agnusdei1207 2023. 5. 31. 12:52
반응형
SMALL
<div
        *ngFor="let menu of menus; last as isLast"
        class="p-2 px-4 py-5 text-white transition-all rounded-md cursor-pointer border-white/5 hover:text-gray-300 active:scale-95"
        [class.border-b]="!isLast"
        (click)="handleMenu(menu)"
      >
        {{ menu.data?.['label'] }}
      </div>

1. isLast : boolean  마지막 요소인 경우 true

2. [class.border-b] = "조건" 참일 경우 클래스 추가

반응형
LIST
저작자표시 (새창열림)

'IT' 카테고리의 다른 글

Tailwind text center 텍스트 중앙 정렬  (0) 2023.06.01
node_modules_ionic_c…enu_3_entry_js.js:2 Menu: must have a "content" element to listen for drag events on. node_modules_ionic_core_dist_esm_ion-menu_3_entry_js.js:2 Menu: must have a "content" element to listen for drag events on. 에러 해결 예시  (0) 2023.06.01
Angular ngModel 활용 예시  (0) 2023.05.31
javascript var, let, const / 블록 레벨 스코프  (0) 2023.05.31
Angular # 활용 예시 / # / Angular 템플릿 참조변수 #  (0) 2023.05.30
'IT' Related Articles more