If you do not specify the field order when opening an Angular form in a modal, the fields will be displayed in alphabetical order. To improve readability and usability, it is best to specify the desired field order either through the relevant routing.module.ts (for dynamically-created interfaces) or through the HTML template (for interfaces that have additional customizations).

If you do not specify the field order

The grid column and modal field order can be controlled by adding the fieldOrder parameter to the relevant HTML file:

fieldOrder="field1,field2,field3"

An example of this in action can be seen in admin-carousel.component.html:

<eg-fm-record-editor #editDialog idlClass="{{idlClass}}" 
  [preloadLinkedValues]="true"
  fieldOrder="owner,name,type,age_filter,max_items,owning_lib_filter,
    copy_location_filter,active,id,bucket,last_refresh_time,creator,
    create_time,editor,edit_time"
  hiddenFieldsList="creator,editor,create_time,edit_time"
  [preSave]="mungeCarousel" (recordSaved)="postSave($event)"
  readonlyFields="last_refresh_time"
  [fieldOptions]="{bucket:{customTemplate:{template:bucketTemplate}},
    copy_location_filter:{customTemplate:{template:locationTemplate}},
    owning_lib_filter:{customTemplate:{template:orgTemplate}}}">
</eg-fm-record-editor>

Note that you can also make use of the hiddenFieldsList parameter for fields that do not need to show on the form, and of the readonlyFields parameter to make specified fields uneditable.