add-docentes-participantes.component.html

<div class="contenedor-dos">
  <form class="formulario" [formGroup]="myForm" (ngSubmit)="onSubmit()">
    <!-- Información de la institución -->
    <div class="columna-unico">
      <!-- Control de fechas inicio -->
      <div class="save-button">
        <button mat-raised-button class="botones" color="primary" *ngIf="!cambio" (click)="cambiar()">Editar</button>
        <button mat-raised-button class="botones" color="primary" *ngIf="cambio" [disabled]="myForm.invalid">Guardar</button>

        <span class="separator"></span>
        <button mat-raised-button class="botones" color="warn" *ngIf="cambio" (click)="cancelado()">Cancelar</button>
      </div>

      <div class="input-container">
        <mat-form-field class="contenedor-dos">
          <mat-label>Seleccionar Campus</mat-label>
          <mat-select [(value)]="selectedCampusId" formControlName="campus">
            <mat-option *ngFor="let campus of campus" [value]="campus.codigo">
              {{ campus.descripcion }}
            </mat-option>
          </mat-select>
        </mat-form-field>
      </div>

      <div class="input-container">
        <mat-form-field class="contenedor-dos">
          <mat-label>Seleccionar Departamento</mat-label>
          <mat-select [(value)]="selectedDepartamentoId" formControlName="departamento">
            <mat-option *ngFor="let departamento of departamento" [value]="departamento.subj">
              {{ departamento.descripcion }}
            </mat-option>
          </mat-select>
        </mat-form-field>
      </div>
      <div class="input-container">
        <mat-form-field class="contenedor-dos">
          <mat-label>Número de docentes Participantes:</mat-label>
          <input matInput formControlName="numero" required pattern="[0-9]+">
          <mat-error *ngIf="myForm.get('numero').invalid && (myForm.get('numero').dirty ||
           myForm.get('numero').touched)">
            Por favor, ingrese un Número de docentes Participantes.
          </mat-error>
        </mat-form-field>
      </div>


    </div>
  </form>
</div>