import { trigger, state, transition, style, animate, keyframes, group, query, stagger } from '@angular/animations';
export const listAnimation = trigger('listAnim', [
transition('* => *', [
query(':enter', style({
opacity: 0
}), { optional: true }),
query(':enter', stagger(100, [
animate('1s', style({
opacity: 1
}))
]), { optional: true }),
query(':leave', style({
opacity: 1
}), { optional: true }),
query(':leave', stagger(100, [
animate('2s', style({
opacity: 0
}))
]), { optional: true }),
])
]);代码是这样的,没有过渡效果!
全网首个介绍官方 Material 组件库用法与 Redux 在 Angular 中的应用
了解课程