ngFor元素上的Angular 2动画bug

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版本。