在伪类中使用CSS变量（自定义属性）

Question

我尝试了以下代码。但是它不起作用。

    .coin:before{
       background-image:var(--dynamic-image);
     }

我想从组件内部的方法传递--dynamic-image。我正在使用Angular Renderer2，而我想要为其设置背景的元素是this.flip。

    flipCoin() {
      this.renderer.setStyle(this.flip.nativeElement, '--dynamic-image' , "url('https://www.w3schools.com/howto/img_forest.jpg')");
    }

我在这里做错什么了吗？