<app-navbar></app-navbar>
<div class="container">
  <div>
    <h4>{{currentPaper.name}}</h4>
    <h4>Write a response about {{currentPaper.topic}} for {{currentPaper.classCode}}</h4>
  </div>
  <form [formGroup]="submissionForm">
    <div formArrayName="questions">
      <div *ngFor="let question of questionList; let i = index" [attr.data-index]="i">
          <div class="row">
            <span>Question {{i+1}}:</span>
          </div>
          <div class="row">
            <label for="{{i}}">{{question.questionText}}</label>
            <textarea id="{{i}}" [formControlName]="i" class="form-control" type="text" rows="3" [value]="answerList[i].answerText" placeholder="Start typing your response here.."></textarea>
          </div>
      </div>
      <!-- Buttons  -->
      <div class="row">
        <button class="btn btn-primary" type="submit" (click)="submit()"> Submit Response </button>
        <button class="btn btn-secondary" type="submit" (click)="save()"> Save As Draft </button>
      </div>
    </div>
  </form>
</div>