离子离子无线电CSS：已选择

Question

我的离子液体中的css有问题...

单击单选按钮时，我想更改CSS。如下所示。

  [type=radio]:checked + ion-icon {
      background-color: $primaryColor;
      color: white;
      font-size: 45px;
  }

上述css适用于html标签，但在ionic中，您有一个名为ion-radio的标签。那么，有没有一种方法可以实现这一点，但是使用ionic的单选按钮呢？

  ion-radio:checked + ion-icon {
      background-color: $primaryColor;
      color: white;
      font-size: 45px;
  }

Answer 1

据我从docs注意到，一旦检查ion-radio，它就会得到类radio-checked。

检查您的元素，一旦检查它们，他们也不会获得此类吗？

Answer 2

如果选中了特定的单选按钮，我将通过添加一个类来修复它。

HTML：

<ion-icon [ngClass]="{'active': (gender == 'Female')}" name="female"></ion-icon>

CSS：

 /* CHECKED STYLES */
  ion-icon.active {
      background-color: $primaryColor;
      color: white;
      font-size: 45px;
  }