Question

我最近开始玩Angular 2和TypeScript。一切顺利，直到我点击Angular 2动画。我知道，它们很简单，但我有一个错误，而且它真的很烦人。

以下是Plunker，以显示正在发生的事情：http://plnkr.co/edit/0YsCgD0yUiIqIrTyuA5s?p=preview

当元素添加到列表中时，动画将运行没有任何问题。但是在从todolist中删除元素时，它将删除所有元素，我不知道为什么。在JS中，仍然有一些元素Angular不会显示它们。动画将在每个元素上运行，而不是没有索引的元素。

这是我的动画：

    trigger('taskState', [

        state('void', style({
            opacity: 0,
            transform: 'translateX(50px)'
        })),
        transition('void => *', [
            animate('0.2s ease-out')
        ]),
        transition('* => void', [
            style({
                transform: 'scale(0)',
                height: 0
            }),
            animate('0.2s ease-in-out')
        ]),

        state('undone', style({ transform: 'scale(1)' })),
        state('done', style({ transform: 'scale(0.975)', opacity: '0.5' })),
        transition('undone <=> done', [
            animate('50ms ease-in-out')
        ])

    ])

Answer 1

此问题已由较新版本的Angular解决。如果有人遇到相同的问题，只需更新您的Angular版本。

ngFor元素上的Angular 2动画bug

1 个答案: