La liste déroulante angulaire ne lit pas la valeur

Question

Je suis nouveau sur Angular, alors pardonnez-moi si je fais des erreurs. J'essaie d'obtenir une liste créée dans une liste déroulante et lorsque l'utilisateur la sélectionne, il doit enregistrer les informations dans la base de données.

Voici mon code : Composant.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,
    });
  }

J'ai recherché la méthode angulaire de lecture d'une valeur dans une liste déroulante et essayé différents noms de variables, mais rien n'a fonctionné jusqu'à présent.

Answer 1

Je pense que la seule chose qui pourrait ne pas aller, c'est si vous essayez retrievalReason: this.RR.get('reasons').value mais c'est pour obtenir le contrôle du formulaire.

Vous n'avez qu'un seul contrôle de formulaire, donc juste retrievalReason:this.RR.value suffit.