Bir snippet bir direktifte yapıldığında CSS neden çalışmayı bıraktı?

Question

Ben

<comment-item file="commentItemDefault" comment="obj.comment></comment-item>

kodunun tamamı şablonun commentItemDefault

<ion-item ng-class="{ 'read': comment.read }"> 
    <h2>{{comment.from}}</h2> 
    <p>{{comment.copy}}</p> 
</ion-item> 

read sınıf uygulanan asla içinde aynı olan bir özel tarz Yorum Item (iyonik) için bir emir yaptı.

.read{ 
    background-color: #660000 !important; 
} 

Bu konuda yardımcı olabilecek herhangi biri var mı?

Answer 1

Çözüm:

.read{ 
    background-color: #bddef4 !important; 
    .item-content{ 
     background-color: transparent !important; 
    } 
} 

iyonik olarak, özel öğe renklerini ve stillerini görmek için .item-content sınıfını atlamanız gerekir.

Umarım bu yardımcı olur. Teşekkürler

Answer 2

Belki Haberim başka bir yazım var, ancak bu gibi görünüyor ng-sınıfının haritası sözdizimi garip bir varyasyon, yapıyoruz gibi görünüyor:

<ion-item ng-class="{ 'read': comment.read }"> ... </ion-item>