Home > Software design >  Mat Select option cant get data
Mat Select option cant get data

Time:08-29

I have this code where i can view the options but cant get the value when selecting it, it just shows blank. I can only view the status options.. Can anyone know how to fix the problem?

HTML File

  <div  *ngIf="selectedTask">
    <div >
        <div >
            <div >
                <div >
                    <div >
                        <h4 ><b>Update Form</b></h4>
                        <p >Update Task Details</p>
                    </div>
                    <div >

                            <div >
                                <div >
                                  <mat-form-field >
                                    <mat-select placeholder="Select Category" [(ngModel)]="selectedTask.status">
                                        <mat-option *ngFor="let s of statusChoice" >{{s}}</mat-option>
                                    </mat-select>
                                  </mat-form-field>
                                </div>
                            </div>

                            
                            <div >
                            <div >
                              <button mat-raised-button  (click)="navigateBack()"  (click)="showNotification('top','center')" (click)="updateEmployee()" ><b>Update Task</b></button>
                              </div>
                            </div>
                            </div>

                            <div >
                            <button type="button" (click)="navigateBack()" ><b>Go Back</b></button>
                            </div>
                            <div ></div>
                          
                    </div>
                </div>
            </div>

        </div>
    </div>

  


  

TS File

statusChoice=["Active","Completed","Cancelled","On Hold"];
selectedStatus: string ='';

CodePudding user response:

Your property is called selectedStatus, and you linked the mat-select to property selectedTask.status.

Also, you should add value to the mat-option.

Change your code like this:

<mat-select placeholder="Select Category" [(ngModel)]="selectedStatus">
  <mat-option *ngFor="let s of statusChoice" [value]="s">{{s}}</mat-option>
</mat-select>
  • Related