Question

我创建了一个自定义Angular 2管道，根据对象内部的ID属性过滤数组。我只是想知道哪些事件（如果有的话）存在于管道中，因为我想在过滤后的数据通过管道时添加动画。

Answer 1

是的，有动态过滤数据的动画。您可以使用：输入和：保留来应用CSS样式。

以下是一个示例。

@Component({
  selector: 'app-selector',
  templateUrl: './templateFile.component.html',
  styleUrls: ['./stylesFile.component.scss'],
  animations: [
    trigger('aliasesAnimation', [
      transition('* => *', [
        query(':enter', style({opacity: 0}), {optional: true}),
        query(':enter', stagger('50ms', [
          animate('250ms ease-in', keyframes([
            style({opacity: 0, transform: 'translateX(-20%)', offset: 0}),
            style({opacity: 0.5, transform: 'translateX(5%)', offset: 0.3}),
            style({opacity: 1, transform: 'translateX(0)', offset: 1.0})
          ]))
        ]), {optional: true}),
        query(':leave', stagger('50ms', [
          animate('250ms ease-in', keyframes([
            style({opacity: 1, transform: 'translateX(0)', offset: 0}),
            style({opacity: 0.5, transform: 'translateX(5%)', offset: 0.3}),
            style({opacity: 0, transform: 'translateX(-20%)', offset: 1.0})
          ]))
        ]), {optional: true})
      ])
    ])
  ]
})

希望它有所帮助，@ T04435

角度2管道事件

1 个答案: