我试图触发绑定到布尔属性的转换,但这似乎没有触发.
这是我的动画触发器的缩减版本
trigger(
'trueFalseAnimation', [
transition('* => true', [
style({backgroundColor: '#00f7ad'}),
animate('2500ms', style({backgroundColor: '#fff'}))
]),
transition('* => false', [
style({backgroundColor: '#ff0000'}),
animate('2500ms', style({backgroundColor: '#fff'}))
])
]
)
Run Code Online (Sandbox Code Playgroud)
HTML:
<div [@trueFalseAnimation]="model.someProperty">Content here</div>
Run Code Online (Sandbox Code Playgroud)
去测试:
ngOnInit() {
setTimeout(() => {
this.model.someProperty = true;
setTimeOut(() => {
this.model.someProperty = false;
}, 5000);
}, 1000)
}
Run Code Online (Sandbox Code Playgroud)
someProperty更改时,触发器永远不会发生.
作为一个快速测试我更改了触发器以使用字符串,它的工作原理
trigger(
'trueFalseAnimation', [
transition('* => Success', [
style({backgroundColor: '#00f7ad'}),
animate('2500ms', style({backgroundColor: '#fff'}))
]),
transition('* => Failed', [
style({backgroundColor: '#ff0000'}),
animate('2500ms', style({backgroundColor: '#fff'}))
])
]
)
Run Code Online (Sandbox Code Playgroud)
去测试: …