是否可以使用angular2中的[style]或[ngStyle]更改伪元素的样式？
为了获得div上的模糊效果,就像叠加一样,我应该在伪元素上设置背景图像.
我尝试过类似的东西
- <div class="blur" [style.before.backgroundImage]="'url('+ featuredImage[i] + ' )'">
它不起作用.我也尝试过这个
@H_301_12@
- <div class="blur" [ngStyle]="'{:before{ background-image:url('+ featuredImage[i] + ' )}}'">
解决方法
不,这是不可能的.它实际上不是Angular问题：伪元素不是DOM树的一部分,因此不暴露任何可用于与它们交互的DOM API.
通常的方法如果你想以编程方式处理伪元素是间接的：你添加/删除/更改类并在CSS中使这个类影响相应的伪元素.因此,在您的情况下,您可以再创建一个更改必要样式的类：
- .blur:before {/* some styles */}
- .blur.background:before {/* set background */}
现在你需要做的就是在你需要伪元素来获取背景时,在元素上切换.background类.例如,您可以使用NgClass.
@H_301_12@ @H_301_12@