opt-cc/static/src/app/manage/squads/edit-squad/edit-squad.component.html

<form #form="ngForm" (keydown.enter)="$event.preventDefault()" class="overview">
  <h3 *ngIf="squad._id">{{'squad.submit.edit.headline' | translate}}</h3>
  <h3 *ngIf="!squad._id">{{'squad.submit.new.headline' | translate}}</h3>

  <div class="form-group">
    <label for="title">{{'squad.submit.field.name' | translate}}</label>
    <input type="text" class="form-control"
           [(ngModel)]="squad.name"
           name="title"
           id="title"
           required maxlength="50"/>
    <show-error displayName="{{'squad.submit.field.name' | translate}}" controlPath="title"></show-error>
  </div>

  <div class="form-group">
    <label for="fraction">{{'squad.submit.field.fraction' | translate}}</label>
    <select id="fraction" name="fraction" class="form-control btn dropdown-toggle"
            required
            [(ngModel)]="squad.fraction">
      <option value="OPFOR">{{fraction.OPFOR}}</option>
      <option value="BLUFOR">{{fraction.BLUFOR}}</option>
    </select>
    <show-error displayName="{{'squad.submit.field.fraction' | translate}}" controlPath="fraction"></show-error>
  </div>

  <div class="form-group">
    <label for="sort">{{'squad.submit.field.sort' | translate}}</label>
    <input id="sort" name="sort" type="number" class="form-control btn dropdown-toggle"
           [(ngModel)]="squad.sortingNumber">
    <show-error displayName="{{'squad.submit.field.sort' | translate}}" controlPath="sort"></show-error>
  </div>

  <div class="form-group">
    <label for="logo">{{'squad.submit.field.logo' | translate}}</label>
    <input id="logo" name="logo" class="ui-button form-control" type="file"
           #fileInput
           accept="image/png"
           (change)="fileChange($event)">
    <span class="label label-bg label-danger center-block" style="font-size:small" *ngIf="showImageError">
        {{'squad.submit.error.logo.type' | translate}}
    </span>

    <img class="preview-image" src="{{imagePreviewSrc}}">
  </div>

  <button id="cancel"
          (click)="cancel()"
          class="btn btn-default">
    {{'squad.submit.button.cancel' | translate}}
  </button>

  <button id="save"
          type="submit"
          (click)="saveSquad(fileInput)"
          class="btn btn-default"
          [disabled]="!form.valid">
    {{'squad.submit.button.submit' | translate}}
  </button>
</form>