'ion-option' is not a known element

Question

I'm dabbling in Ionic for the first time, learning from the beginning using the components documentation, and I got stuck with this error: Template parse errors: 'ion-option' is not a known element:

When using a select component in this way:

<ion-select [(ngModel)]="gaming">
 <ion-option value="nes">NES</ion-option>
</ion-select>

I have searched and found solutions like this: Ionic button showing 'ion-button' is not a known element however, using something like <option ion-option value="nes">NES</option> doesn't work. Even, I include the schemas: [CUSTOM_ELEMENTS_SCHEMA] line in my module, but no options are showed. I'm using:

ionic (Ionic CLI) : 4.5.0 
Ionic Framework   : @ionic/angular 4.0.0-beta.16

I'll be grateful if someone can help me.

Answer 1

<ion-item>
  <ion-label>Hair Color</ion-label>
  <ion-select value="brown" ok-text="Okay" cancel-text="Dismiss">
    <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>

ionic 4 has changed its syntax.

Answer 2

Use 'ion-option' instead of 'ion-select-option'.

<ion-item>
  <ion-label>Gender</ion-label>
  <ion-select [(ngModel)]="this.gender">
    <ion-option value="f">Female</ion-option>
    <ion-option value="m">Male</ion-option>
  </ion-select>
</ion-item>

It works for me as expected. Thank You