angular2伪选择器样式

Question

我可以使用Angular2设置Pseudo Selector的样式。

<section class="inner_content person_content backdrop poster"  *ngIf="personAllMoviesArray.length > 0">
    <div class="personFavouritePoster"></div>
    <div class="single_column_medium">
        {{id}}
    </div>
</section>

CSS是

section.inner_content.backdrop:before {

background-image: url('https://image.tmdb.org/t/p/w1440_and_h405_bestv2/fBFPLjqiLTDW3GWgWIRkhHTwAcb.jpg');}

Answer 1

你可以定义一个像css一样的类

.has-before:before {
   background-image: url('https://image.tmdb.org/t/p/w1440_and_h405_bestv2/fBFPLjqiLTDW3GWgWIRkhHTwAcb.jpg');
}

并通过一些切换变量添加切换类

<section [class.has-before]="toggleVariable"
         class="inner_content person_content backdrop poster" 
         *ngIf="personAllMoviesArray.length > 0">
     <div class="personFavouritePoster"></div>
     div class="single_column_medium">
         {{id}}
     </div>
</section>