Is there a way to translate css selectors(::after, ::before) content using ngx-translate?

Question

Is there a way to translate css selectors(::after, ::before) content using ngx-translate ?

.custom-file-label::after {
    content: "Browse"
}

Ouster

Answer 1

in html add

 <div class="custom-file-label" [attr.your-custom] = "{{ 'Browse' | translate}}"></div>

and in css

.custom-file-label::after { 
        content: attr(your-custom);
 }

Bummalo

we had to remove the square brackets around [attr.your-custom] because the following value is a template expression and not an identifier from the ts class. Then it worked great, but it left us with a warning complaining that your-custom is not an allowed attribute. Using the prefix data- did not help with that either. – Vedette

I happend to have a similar problem and @Margeth answer pointed me to the right direction. There is a small issue when 'sth.sth' is not a string. In my working example, which uses json translate file I had to use a variable instead of string | translate and do the manual translation inside typescript file: this.translate.instant(variable). Now works like a charm. – Ebersole