更改angular2中伪元素的样式

是否可以使用[style]或[ngStyle]在angular2中更改伪元素的样式？

为了使div上的模糊效果像叠加层一样，我应该在伪元素上设置背景图像。

我尝试了类似的东西

<div class="blur" [style.before.backgroundImage]="'url('+ featuredImage[i] + ' )'">

它没有用。我也试过了

<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在需要before伪元素获取背景时在元素上切换类。NgClass例如，您可以使用。