角2 - 与ngStyle

Question

元素的CSS过渡，我不能让我的CSS转换时与[ngStyle]或[style.property]绑定要更新的属性工作

HTML：

<div class="bar" [style.width]="size +'%'"></div> 

CSS：

.bar{ width:0; transition: width .5s ease-out; } 

JS：尺寸正确更新...

可以肯定，如果我删除次e样式在html中绑定并更新宽度：hover，转换正在工作。我想念什么？

如果我让[style.width]绑定并将其悬停在前。宽度：50％！重要的，过渡作品。尽管它不是我想要实现的，但它看起来像ngStyle阻止了转换。而！重要的是必需的。

但是这不工作之一：在此设置

[ngStyle]="{'width': size +'% !important'}" 

Answer 1

，你不得不推迟大小可变的结合，

export class AppComponent{ 

    constructor(){ 
    setTimeout(()=>{ 
     this.size=20; 
    },1000) 
    } 

}