Skip to content

Instantly share code, notes, and snippets.

@mrtcmn
Last active October 27, 2017 19:37
Show Gist options
  • Save mrtcmn/1cdae9a1efa7c7a02c3748f195489eba to your computer and use it in GitHub Desktop.
Save mrtcmn/1cdae9a1efa7c7a02c3748f195489eba to your computer and use it in GitHub Desktop.
<form [formGroup]="_FormGroup" (ngSubmit)="onSubmit()" novalidate>
<div [ngClass]="stylesConfig.field">
<label [ngClass]="stylesConfig.label">Form Name</label>
<div class="control">
<input [ngClass]="stylesConfig.formNameInput" type="text" placeholder="Form Name" formControlName="formName">
</div>
</div>
<div [ngClass]="stylesConfig.field">
<label [ngClass]="stylesConfig.label">Form Description</label>
<div class="control">
<input [ngClass]="stylesConfig.formNameInput" type="text" placeholder="Description" formControlName="decs">
</div>
</div>
<div formArrayName="questions"
*ngIf="questions" >
<div
*ngFor="let question of questions.controls; let i=index"
[formGroupName]="i"
[ngClass]="stylesConfig.questionMain" >
<!-- The repeated address template -->
<h4>question #{{i}}</h4>
<div class="field has-addons">
<p class="control is-expanded">
<input class="input" [ngClass]="stylesConfig.input" formControlName="question">
</p>
<p class="control">
<span class="select">
<select formControlName="questionType">
<option value="wa">Write Area</option>
<option selected value="mc">Multiple Choise</option>
<option value="cb">Checkbox</option>
<option value="ls">Linear Scale</option>
<option value="da">Date</option>
</select>
</span>
</p>
</div>
<div [ngClass]="stylesConfig.answersMain"
formArrayName="answers"
class="well well-lg">
<div *ngFor="let answer of questions.controls[i].controls.answers.controls; let k=index" [formGroupName]="k">
<div [ngClass]="stylesConfig.fieldHasAdd">
<div class="control">
<input
[ngClass]="stylesConfig.answersInput"
type="text"
placeholder="Answers {{k}}"
formControlName="value">
</div>
</div>
<!-- answers loop end -->
</div>
</div>
<button (click)="addAnswer(i)" type="button">Add Answer</button>
<!-- question loop end -->
</div>
<button (click)="addItem()" type="button">Add Question</button>
</div>
</form>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment