当表单以角提交时,如何获取多个mat-radio-button值

时间:2019-05-11 04:01:07

标签: angular angular-forms angular-material-7

我使用了有角度的材料设计,但是当我尝试获取用ngFor循环迭代的多个垫单选按钮值时,我无法在表单提交时获得此选定的单选按钮值。所以请您帮我,如何使用模板变量引用在表单提交时获取此值。

<form #questionForm="ngForm" (ngSubmit)="onSubmitQuestions(questionForm)">
    <mat-card>
    <mat-accordion class="pf-questions-headers-align">
    <div class="question_inner" *ngFor="let question of questions; let i=index">
      <mat-expansion-panel  [expanded]="step === i" (opened)="setStep(i)" hideToggle>
        <mat-expansion-panel-header>
          <mat-panel-title>
           <span matBadge="{{i+1}}" matBadgeOverlap="false"></span> {{question.question}}
          </mat-panel-title>
          <mat-panel-description>
            <mat-icon>account_circle</mat-icon>
          </mat-panel-description>
        </mat-expansion-panel-header>

        <mat-radio-group name="question_name" ngModel #question_name="ngModel"
      aria-labelledby="pf-radio-group-label"
      class="pf-radio-button">
        <mat-radio-button class="pf-q-radio-button" *ngFor="let option of question.option" [value]="option.id">{{option.option_name}}
        </mat-radio-button>
        </mat-radio-group>

        <mat-action-row>
        <button mat-button *ngIf="i != 0" color="warn" (click)="prevStep()">Previous</button>
          <button mat-button *ngIf="i != 19" color="primary" (click)="nextStep()">Next</button>
        </mat-action-row>
      </mat-expansion-panel>

      </div>
    </mat-accordion>
    <div class="sbmt-questions">
        <!-- <button type="submit" mat-raised-button class="btn btn-primary" >Submit</button> -->
        <input type="submit" class="btn btn-primary" value="Submit">
    </div>
    </mat-card>
    </form>

请帮助我解决此问题。预先感谢!

0 个答案:

没有答案