Help with annidate form

Ionic Framework
1

Hello everybody,
I have a select with two options: yes and no;
if the user selects another select will appear.
i tried with * ngIf and (ionChange) but it doesn’t work!

tamplate:

<ion-select formControlName="current" (ionChange)=ionChange($event) required>
     <ion-select-option>Yes</ion-select-option>
     <ion-select-option>No</ion-select-option>
</ion-select>
<ion-input formControlName = "size" *ngIf = "current==Yes" required></ion-input>

component:

current:string;
ionChange(event){
    this.current = event.target.value;
}
2

in this case you don’t need a ionChange event.
You can do something like:


      <ion-select  [(ngModel)]="current" >
        <ion-select-option  [value]="Yes">Yes</ion-select-option>
        <ion-select-option  [value]="No">no</ion-select-option>
      </ion-select>

anyway if you want to use a form, I would use a Formgroup element.

this.formItem: Formgroup;


  ngOnInit() {
    this.formItem = new FormGroup({
      current: new FormControl(''),
    });

etc etc.
  }


The first solution works without a formgroup.
3

Thanks for the reply.

in the end the error was trivial, since in reality the template was:

<ion-select-option>
Yes
<ion-select-option>

then he saved me ’ yes ’ with spaces :expressionless:
…
but I have another question: if I had a button, which is disabled when the form is invalid. Since the ionic input appears it gives me the error

ERROR Error: NG0100: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: ‘false’. Current value: 'true’

is there a solution to this?

4

You are using the form in a wrong way. The solution is using [value] in your ion-select-option instead of checking an event on ionChange.

In your button you can check the condition [disabled]=“your_condition” (i really suggest to have a boolean condition and not a string)