Form control reverse order angular

Viewed 194

Reverse order in FormControl, I'am creating some like this

private createControl(questions): FormGroup {
    const facadesControls = {};
    for (let i = 0; i < questions.length; i++) {
      facadesControls[questions[i].question] = this.formBuilder.control(
        { value: questions[i].value, disabled: false },
        [Validators.min(0), Validators.max(100), Validators.required]
      );
    }
    return this.formBuilder.group({
      ...facadesControls
    });
  }
}

The problem is that when I try something like this

  <ng-container *ngFor="let question of form.controls | keyvalue, let i = index">
  </ng-container>

I got them in reverse order? Any idea why is this happening?

1 Answers

Since keyvalue pipe take defaultComparator as default compareFn, It's sorting in alpha ascending, you can change this by passing custom function to preserve orginal order

component.ts

 compareFunction = (_a,_b): number => {
      return 0;
 }

component.html

  <ng-container *ngFor="let question of form.controls | keyvalue:compareFunction, let i = index">
  </ng-container>
Related