CODEWITHSUNDEEP
htmlangulartypescript
Mathew Dodson
Mathew Dodson

Reputation: 13

Angular Dropdown list not reading value

I'm new to Angular so forgive me if I have this whole thing wrong. I'm attempting to get a created list in a dropdown and when the user selects it, it should record the information to the database.

Here is my code: Component.html

<mat-form-field appearance="fill">
  <mat-label>Retrieval Reason</mat-label>
  <mat-select [formControl]="RR" required>
    <mat-option>--</mat-option>
    <mat-option *ngFor="let reason of reasons" [value]="reason">
      {{reason.reason}}
    </mat-option>
  </mat-select>
  <mat-error *ngIf="RR.hasError('required')">Please choose a reason</mat-error>
</mat-form-field>

  <button
    mat-raised-button
    (click)="done()"
    color="primary"
    [disabled]="selection.selected.length === 0 || RR.hasError('required')"
  >
    Retrieve
  </button>

Component.ts

  retrievalReason: Reasons;
    RR = new FormControl('', Validators.required);

  reasons: Reasons[] = [
    {reason: 'Cycle Count'},
    {reason: 'Purge Request'},
    {reason: 'Picking'},];

    done() {
    this.dialogRef.close({
      carrier: this.carrier,
      destination: this.selection.selected[0].dstId,
      retrievalReason: this.RR.get('reasons').value,
    });
  }

I've looked up the Angular method to reading a value from a dropdown list and have tried different variable names, nothing's worked so far.

Upvotes: 1

Views: 58

Answers (1)

Nathan T.
Nathan T.

Reputation: 298

The only thing I see that could be wrong is that you try retrievalReason: this.RR.get('reasons').value but this is for a form to get the formcontrol.

You only have a formcontrol so just retrievalReason:this.RR.value should be enough.

Upvotes: 1

Related Questions