не n-й дочерний селектор не работает в sass

Question

Я пытаюсь применить определенные стили ко всем элементам в списке, кроме первого потомка.Я думаю, что настроил Sass правильно, однако стиль не применяется в настоящее время.

html

  <div class="list">
                    <div *ngFor="let item of data; index as i; first as isFirst; last as isLast"class="list-item">

                        <input class="radio" name="radio" type="radio" />
                        <label for="radio1">Buttom</label>
                    </div>

        </div>

sass

 .list label:not(:nth-of-type(1))::before{
  background-color:blue;
}

Answer 1

Если вы имеете в виду выбор всех .list-item, кроме первого, CSS будет выглядеть следующим образом:

.list-item:not(:nth-of-type(1))::before {
    content: '';
    background-color:blue;
}

Поскольку вы используете псевдоэлемент ::before, вы можете использовать content: '' дляукажите некоторый контент, иначе background-color не будет иметь никакого эффекта.

Answer 2

Вы можете добиться этого, используя все элементы bg синего и первого bg на белом или независимо от того, какой у вас фон.

<div class="list">
<div *ngFor="let item of data; let i=index"  [class.first]="i === 0">
    <input class="radio" name="radio" type="radio" />
<label for="radio1" class="lbl">{{item.name}}</label>

и ваш css должен выглядеть следующим образом:

label {
  background-color:blue;
}
.first label {
  background-color: #fff;
}

Я предполагаю, что ваши данные таковы:

 data = [
    {name: "car"},
    {name: "truck"},
    {name: "bike"}
  ]

Это рабочий пример