从 ion-select 中删除 ion-radio - Ionic v4

Question

I would like to remove ion-radio which are generated when i call ion-select (with a popover interface)

<ion-item>
    <ion-label>Popover</ion-label>
    <ion-select interface="popover" placeholder="Select One">
      <ion-select-option value="brown">Brown</ion-select-option>
      <ion-select-option value="blonde">Blonde</ion-select-option>
      <ion-select-option value="black">Black</ion-select-option>
      <ion-select-option value="red">Red</ion-select-option>
    </ion-select>
</ion-item>

the code above generates ion-radio elements in the shadow DOM.

I tried to select them (trying a display: none, or modifying a property with css4 (--border-width for example)).

I also tried the interfaceOptions method [interfaceOptions]="{cssClass:'custom-popover'}", without success.

Thanks a lot

Answer 1

Can you try with mode="ios".

<ion-select placeholder="Select One" mode="ios">
  <ion-select-option value="f">Female</ion-select-option>
  <ion-select-option value="m">Male</ion-select-option>
</ion-select>

Answer 2

If anyone comes looking for an answer, simple solution:

1. add the attribute [interfaceOptions]="customOptions" to the ion-select tag
2. in the component.ts file add a property (before constructor) customOptions = { mode: 'ios' };