我正在尝试用+或-样式设置手风琴标题,具体取决于手风琴是否打开。我遇到的问题是,即使每个手风琴都单独打开,我也无法获得个人风格。因此,如果一个是开放的,它们都被标记为开放(都有负号)。
模板:
<accordion [closeOthers]=true>
<accordion-group *ngFor="let activity of activities"
(isOpenChange)="openStatusChange($event)"
[panelClass]="customPanelClass">
<div accordion-heading (click)="openPanel(activity)">
<div *ngIf="isOpen" class="glyphicon glyphicon-minus"> <span style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">{{activity.Name}}</span></div>
<div *ngIf="!isOpen"class="glyphicon glyphicon-plus"> <span style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">{{activity.Name}}</span></div>
</div>
<p> Internal accordion stuff ... </p>
</accordion-group>
</accordion>
组件:
export class AccordianComponent implements OnInit, OnChanges {
activities: ActivityType[];
chemicals: Chemical[];
isOpen: boolean = false;
customPanelClass: string = "panel panel-info";
constructor(
private _activityService: ActivityService,
private _chemicalService: ChemicalService
) { }
ngOnInit() {
this.getActivities();
}
openStatusChange(event: boolean) {
this.isOpen = event;
}
}