2

Lo que se quiere hacer quizá sea un poco rebuscado. Tengo un intervalo de fecha/hora que disparan una consulta a la base de datos. Estos datos son el contenido con el cual necesito llenar a este selector, y necesito que el selector se llene quede seleccionado el primer elemento.

Hasta el momento lo que tengo logrado es que el selector cargue el contenido de lo que trae la base de datos pero no sé como hacer para que de ese contenido muestre el primero.

HTML:

     <form [formGroup]="formGateway">
      <mat-form-field class="textBox" appearance="fill">
        <mat-label> Gateway seleccionado </mat-label>
        <mat-select
          formControlName="gatewayId"
        >
          <mat-option
            *ngFor="let gw of basicGatewayDTO"
            [value]="gw.gateway_id"
          >
            {{ gw.gateway_name }}
          </mat-option>
        </mat-select>
      </mat-form-field>
    </form>

TypeScript:

formGateway: any;
basicGatewayDTO: basicGatewayDTO[] = [];

constructor(
    private formBuilder: FormBuilder,
  
) {
  this.formGateway = formBuilder.group({ gatewayId: new FormControl('') });
}
ngOnInit(): void {
  this.FiltrarGateways().then((respuesta) => {
      let respStr = JSON.stringify(respuesta);
      this.basicGatewayDTO = JSON.parse(respStr);

  });
}

Resumí el código para que se entienda cómo lo estoy manejando (por ejemplo no se muestra el método que retorna la promesa que trae la información), sin embargo estoy abierto a otras formas de realizarlo.

Lo que quiero hacer es setear la propiedad del selector a que tenga seleccionado el primer index o primera opción, suponiendo que lo que trae la base de datos exista. Podría ser algo así como esto:

setValueSelector(valor: string){
    this.formGateway.gatewayId.setValue(valor);
  }

O en lugar de establecer el valor, establecer la posición, la opción, lo que sea mejor y más práctico para darle solución.

Agradezco cualquier información al respecto

1 respuesta 1

2

Tendrías que ingresar al formControlName y setear el primer valor que te trae el JSON:

this.FiltrarGateways().then((respuesta) => {
   this.basicGatewayDTO = repuesta;
   this.formGateway.get("gatewayId").setValue(respuesta[0].gateway_id);
});
1
  • 1
    Buenisimo era justo lo que necesitaba. Primero obtenes el selector y después le seteas el valor, simple y al grano. Muchas gracias el 20 oct. 2022 a las 15:34

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.