在 Angular2 中应用条件模糊滤镜样式不起作用

Question

我有一个 div 当我想在它上面应用模糊滤镜但有条件地，比如“

          <div class="card" [style.filter]="visibile?'blur(0px)':'blur(3px)'"
</div>

和组件内部

this.visible = true // or false

但我没有得到这种风格，如果我像上面那样应用其他风格，如不透明度、背景颜色和其他风格，但不是过滤器风格

有什么想法吗？

Answer 1

改用 ngClass :

 <div class="card" [ngClass]="visible ? 'blur' : ''"
 </div>


 @Component({
   //..
   styles:['.blur{filter:blur(3px);}']
 })

applying conditional blur filter style in Angular2 is not working