anzeigen Eingang nur dann, wenn eine bestimmte Eingabe gilt

Question

Ich habe das folgende Formular in Ionic 2 (Winkel):

<form [formGroup]="newEventForm"> 

     <ion-item> 
     <ion-label floating>Title</ion-label> 
     <ion-input formControlName="title" type="text"></ion-input> 
     </ion-item> 

     <ion-item> 
     <ion-label>Sport</ion-label> 
     <ion-select formControlName="sport"> 
      <ion-option value="Running">Running</ion-option> 
      <ion-option value="Football">Football</ion-option> 
      <ion-option value="Yoga">Yoga</ion-option> 
      <ion-option value="Golf">Golf</ion-option> 
     </ion-select> 
     </ion-item> 

     <ion-item> 
     <ion-label>Début</ion-label> 
     <ion-datetime displayFormat="DD MMM YYYY" formControlName="timeStarts"></ion-datetime> 
     </ion-item> 

     <ion-item> 
     <ion-label>Où</ion-label> 
     <ion-input [hidden]="!sport.valid" formControlName="location" type="text" (click)="presentNewLocationModal()"></ion-input> 
     </ion-item> 


     <button ion-button type="submit" [disabled]="!newEventForm.valid">Submit</button> 

    </form> 

Ich mag die Ortseingabe nur dann angezeigt werden, wenn eine Sportart ausgewählt ist.

Ich versuchte mit [hidden] = "! Sport.valid", aber es funktioniert nicht ... irgendeine Ahnung?

Answer 1

versuchen mit diesem newEventForm.controls [ 'Sport']. Gültig

<ion-item [hidden]="!newEventForm.controls['sport'].valid"> 
     <ion-label>Où</ion-label> 
     <ion-input formControlName="location" type="text" (click)="presentNewLocationModal()"></ion-input> 
     </ion-item>