Search code examples
angularangular-material2angular-forms

ngIf selected item is a specific value then


I'm trying to create a form in Angular with Angular Materials. Now i'm struggling with this. When i select a value in the select option with the label "type behandeling" it needs to set the value of the next input field with the placeholder "begin tijd".

<mat-form-field>
  <mat-label>Type behandeling</mat-label>
     <mat-select [(ngModel)]="data.cure" >
       <mat-option *ngFor="let typeCure of typeCures" [value]="typeCure.value">
            {{typeCure.viewValue}}
        </mat-option>
     </mat-select>
 </mat-form-field>

      <mat-form-field>
          <input matInput type="time" placeholder="Begin tijd" [(ngModel)]="data.begin">
      </mat-form-field>

For example if the value of the select field is "Sittard" then the input field must have the value "13:00".

Is there anyone out there who can help me fix this? Thanks!


Solution

  • you can try like this

    HTML

     <mat-form-field>
      <mat-label>Type behandeling</mat-label>
      <mat-select [(ngModel)]="data.cure" >
        <mat-option *ngFor="let typeCure of typeCures" [value]="typeCure.value" (selectionChange)="doSomething(typeCure.value)">
             {{typeCure.viewValue}}
         </mat-option>
      </mat-select>
     </mat-form-field>
    
      <mat-form-field>
          <input matInput type="time" placeholder="Begin tijd [(ngModel)]="selectedValue">
      </mat-form-field>
    

    TS

      selectedValue: any;
      doSomething(data) {
       this.selectedValue = data;
      }