0
헬로우 스택 커뮤니티,
사용자의 태풍에 노출되지 않는 몇 가지 추가 세부 정보가있는 개체 배열이 있습니다. ngFor
을 통해 배열에 사용 가능한 모든 객체를 표시하고 토글 버튼을 추가하여 각 배열 요소별로 세부 사항을 표시하거나 숨기려고합니다. 현재, 나는 다음과 같은 솔루션을 사용하고 있습니다 : 각 이벤트마다 배열의 I 세부 가시성을 구동 별도의 배열에 추가 boolean
값 저장 :
틀 :각도 2/4 목록 요소 세부 정보 표시 및 숨기기
<ul>
<li *ngFor="let schedule of schedulesList; let idx = index">
<div>
{{schedule.beginDate}} to {{schedule.endDate}}
<span>
<i class="material-icons md-24" >{{configureMdIcon}}</i>
<i class="material-icons md-24" (click)="eventListVisibility($event, idx)">{{seeListMdIcon}}</i>
{{scheduleEventsListVisible}}
</span>
<div *ngIf="eventsVisible[idx]">Events:
<ul>
<li *ngFor="let event of schedule.additionalEvents">
{{event.details}}
</li>
</ul>
</div>
</div>
</li>
</ul>
CONTROLER :
eventListVisibility(e: Event, idx: number){
if(typeof this.eventsVisible != undefined){
this.eventsVisible[idx] = !this.eventsVisible[idx];
}
이 코드 작품 하지만 제 질문은 :
더 영리한 방법이 있습니까? 가시성을 높이기 위해 추가 배열을 사용하는 것이 낭비이고 Angular를 아는 한이 문제를 해결할 숨겨진 기능이 일부있을 것입니다.
어떤 종류의 도움에 감사드립니다.
내 의견이 유용하다면 올바른 것으로 표시해주세요. 대답. –