老师，我在添加paroject的时候:enter会被触发， 但是在删除project是:leave不会被出发。

Question

query(':leave', style({opacity: 1}), { optional: true}),

query(':leave', stagger(100, [

animate('5s', style({opacity: 0}))

]),

Answer 1

123321_0015 2018-11-23 21:46:55

我也发现这个问题，研究了好久，发现老师的那个也不能触发：leave。经研究发现应该是query找不到子元素离开时的事件，所有没有添加动画效果。

我就把这个动画改为了如下的代码

state('void', style({ opacity: 0 })),

state('*', style({ opacity: 1 })),

transition(':enter', animate('1s')),

transition(':leave', animate('1s'))

然后在ProjectItemComponent中添加

@HostBinding("@listAnim") listAnimState;

就好使了。

不过也有个小问题就是当项目多个创建时只能全部出现，不能有延迟，不过可以用其他的方式也做，

如下代码

transition(':leave', [

query('*', [

style({ opacity: 1 }),

stagger(0, [

animate('1s', style({ opacity: 0 }))

])

], { optional: true }),

])

这个是离开的代码。

Answer 2

张胜O_O 2018-09-08 14:16:23

请问有解决吗？我的也不行，之后复制老师的代码也不生效，不知道Angular6改了什么地方

Answer 3

接灰的电子产品 2018-08-15 09:14:39

看一下我的 github 源码对比一下吧 https://github.com/wpcfan/taskmgr

• DBkey_li #1

  老师  代码时一样的，删除时没有渐出动画