ionic list加载淡出淡入效果
test.ts
import {trigger, style, animate, transition} from '@angular/animations';
@Component({
selector: 'booking',
templateUrl: './booking.html',
styleUrls: ['./booking.scss'],
animations: [
trigger(
'enterAnimation', [
transition(':enter', [
style({opacity: 0}),
animate('500ms', style({opacity: 1}))
]),
transition(':leave', [
// style({opacity: 1}),
// animate('100ms', style({opacity: 0}))
])
]
)
]
})
test.html
<ion-list *ngFor="let item of bookingList" [@enterAnimation]>
</ion-list>