Как поменять отмеченный кружок радиогруппы на галочку в ionic 5

Question

Я работаю в ionic 5, и я хочу изменить отмеченный кружок радиосвязи, чтобы он соответствовал дизайну ux, пожалуйста, помогите мне в этом. Вот код.

<ion-list>
  <ion-radio-group>
    <ion-list-header>
      <ion-label>
        Auto Manufacturers
      </ion-label>
    </ion-list-header>

    <ion-item>
      <ion-label>Cord</ion-label>
      <ion-radio value="cord"></ion-radio>
    </ion-item>

    <ion-item>
      <ion-label>Duesenberg</ion-label>
      <ion-radio value="duesenberg"></ion-radio>
    </ion-item>

    <ion-item>
      <ion-label>Hudson</ion-label>
      <ion-radio value="hudson"></ion-radio>
    </ion-item>

    <ion-item>
      <ion-label>Packard</ion-label>
      <ion-radio value="packard"></ion-radio>
    </ion-item>

    <ion-item>
      <ion-label>Studebaker</ion-label>
      <ion-radio value="studebaker"></ion-radio>
    </ion-item>
  </ion-radio-group>
</ion-list>

Answer 1

В mode собственность для ion-radio можно принудительно установить его на iOS, которая использует проверки вместо обычного "радио" стиля.

https://ionicframework.com/docs/api/radio

mode Описание
Режим определяет, какие стили платформы использовать.

Режим атрибута Тип "ios" | "мкр"

<ion-item>
  <ion-label>Cord</ion-label>
  <ion-radio mode="ios" value="cord"></ion-radio>
</ion-item>

Я не думаю, что это лучший выбор дизайна, поскольку флажки и переключатели имеют разные значения пользовательского интерфейса и взаимодействия, но я думаю, что iOS делает это таким образом.

Вот пример stackblitzhttps://stackblitz.com/edit/ionic-angular-v5-y8wjvk