How do I stop Angular from automatically alphabetizing object keys?

Question

I have this array...

public incidents: any[] = [
  {
    id: 1,
    name: "Default Case Set",
    type: "CASEWORK",
    str: 34,
    mtdna: 0,
    ystr: 0,
    xstr: 0,
    snps: 0
  }
]

I'm passing it into a modal like this...

public openEditModal(id: number): void {

  this.incidentToBeEdited = this.incidents.filter(result => result.id == id).pop();

  const initialState: ModalOptions = {
    initialState: {
      items: this.incidentToBeEdited,
      title: 'Edit Incident'
    }
  };

  // Close modal
  this.bsModalRef = this.modalService.show(EditModalComponent, initialState);
}

The problem is that the keys in the object in the incidents array are automatically alphabetized.

When I console the "this.incidentToBeEdited" variable, I get this...

{
    mtdna: 0
    name: "Default Case Set"
    snps: 0
    str: 34
    type: "CASEWORK"
    xstr: 0
    ystr: 0
}

So the object that gets sent to the modal (for display purposes) is automatically alphabetized.

I don't want this because I want the fields to appear as they do in the table, which is how they are in the original incidents array.

Is there anyway I can override Angular's need to alphabetize an object?

Here is the code for EditModalComponent...

export class EditModalComponent implements OnInit {

  constructor(
    public bsModalRef: BsModalRef,
    private http: HttpClient,
    private formBuilder: FormBuilder) {
    this.items = this.items;
    this.bsModalRef = this.bsModalRef;

    this.editModal = this.formBuilder.group({});    
  }

  // Page loading properties

  public httpRequestInProgress: boolean = false;
  public pageLoaded: boolean = false;
  public pageLoadError: string = '';
  public pageLoading: boolean = true;

  // Properties

  public editModal: FormGroup;

  public items?: any;

  public title?: string;

  // Methods

  ngOnInit(): void {

    this.editModal = this.formBuilder.group(
      this.items
    )
    console.log("this.items", this.items);

    // Remove id from list of items
    const itemsInAnArray = [this.items];
    itemsInAnArray.forEach((item: any) => delete item.id);

    this.pageLoading = false;
    this.pageLoaded = true;

  }

}

Here is the HTML for EditModalComponent...

<form [formGroup]="editModal" *ngIf="this.items">

        <div class="row">

          <div class="col-sm-12">

            <div *ngFor="let item of this.items | keyvalue">

              <div class="col-sm-12 mb-3">
                <label class="text-capitalize" for="firstName">{{item.key}}</label>
                <input class="form-control"
                        id="{{item.key}}"
                        value="{{item.value}}"
                        formControlName="{{item.key}}">
              </div>

            </div>          

          </div>

          <div class="mt-3">
            <button class="btn btn-primary float-start"
                    type="button"
                    (click)="saveAsync()">
              Save
            </button>
            <button class="btn btn-secondary me-1 float-start"
                    type="button"
                    (click)="bsModalRef.hide()">
              Cancel
            </button>
          </div>

        </div>

      </form>
    ```