-2

I creating a form builder like this https://stackblitz.com/edit/angular-dynamic-survey-creation-golkhg?file=src%2Fapp%2Fcreate-survey%2Fcreate-survey.component.html I do exactly like that but I don't use material design and this part doesn't work

<div *ngIf="questionCtrl.controls.questionGroup.controls.options">
                          <ul class="question-type" formArrayName="options">
                            <li
                              *ngFor="let optionCtrl of questionCtrl.controls.questionGroup.controls.options.controls let j = index">
                              <div [formGroupName]="j">
                                <mat-form-field>
                                  <input formControlName="optionText" matInput placeholder="option text" maxlength="100"
                              [required]="true">
                          </mat-form-field>
                                  <button mat-raised-button *ngIf="j>=2" (click)="removeOption(i,j)" color="warn">
                             X
                            </button>
                              </div>
                            </li>
                          </ul>
                          <button mat-raised-button type="button" (click)="addOption(i)" class="mat-sm-button add-option-btn" color="accent"> Add option</button>
                        </div>
                        <div
                          *ngIf="questionCtrl.controls.questionGroup.controls.showRemarksBox">
                          <mat-slide-toggle formControlName="showRemarksBox">
                            Show Remarks Textarea
                          </mat-slide-toggle>
                          <mat-form-field class="full-width">
                            <textarea  style="resize: none;" disabled  matInput placeholder="Textarea"></textarea>
                          </mat-form-field>
                        </div>

my code like this

<div *ngSwitchCase="'Kotak Centang'">
                                            <div *ngIf="questionCtrl.controls.questionGroup.controls.options">
                                                <ul formArrayName="options  ">
                                                    <li
                                                        *ngFor="let optionCtrl of questionCtrl.controls.questionGroup.controls.options let j = index">
                                                        <div [formGroupName]="j">
                                                            <input formControlName="optionText" matInput
                                                                placeholder="option text" maxlength="100"
                                                                [required]="true">
                                                            <button *ngIf="j>=2" (click)="removeOption(i,j)"
                                                                color="warn">X
                                                            </button>
                                                        </div>
                                                    </li>
                                                </ul>
                                                <button nbButton type="button" (click)="addOption(i)"
                                                    class="mat-sm-button add-option-btn" color="accent"> Add
                                                    option</button>
                                            </div>
                                        </div>
Seyedraouf Modarresi
  • 1,213
  • 9
  • 14
naoval
  • 338
  • 6
  • 29
  • Can you recreate a simple version of your problem in stackblitz? There needs to be more focus on the specific problem you're having. – Kurt Hamilton Apr 11 '20 at 07:46
  • actually i can't but i can give you a repo – naoval Apr 11 '20 at 08:07
  • Why can't you recreate your problem in stackblitz (or any other live coding site)? – Kurt Hamilton Apr 11 '20 at 08:08
  • https://stackblitz.com/edit/angular-md5shc i've recreated this but it gives me an error – naoval Apr 11 '20 at 08:11
  • even if i use the entire code from https://stackblitz.com/edit/angular-dynamic-survey-creation-golkhg it doesn't work – naoval Apr 11 '20 at 08:18
  • By "recreate a simple version", I didn't mean "copy your whole project" as is. The trick to debugging your own code (and helping others to) is to keep on removing parts of your code that aren't related to the problem. In your case, you want to do something with a form array. Unless I see an example using the simplest form array possible that recreates your problem, I'm probably not going to spend 10 minutes of my day trying to isolate your problem for you. Other people might, but you're reducing your chances of people engaging with your question. – Kurt Hamilton Apr 11 '20 at 08:19
  • yes sorry, but i just copied 1 component though not the whole project – naoval Apr 11 '20 at 08:34

1 Answers1

0

turns out, the value to use in ng switch doesn't work properly, i've fixed this by using [(value)] instead [(selected)] when selecting the ngswitch

naoval
  • 338
  • 6
  • 29