es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

¿Cómo establecer un valor seleccionado en mat-select?

30 May, 2023 Programación

Estoy listando una lista de valores en mat-select. Aquí está mi código:

<div class="row">
    <div class="col-md-1">
        <mat-form-field class="mat-form-field-fluid">
            <mat-select placeholder="seleccionar" formcontrolname="myList" id="myList">
                <ngx-mat-select-search [formcontrol]="frmControl" #fltr=""></ngx-mat-select-search>
                <mat-option id="myListValue" [value]="item.code" *ngfor="let item of ListOfSelect | filterByProperty: ['descp', filter.value]">{{item.description}}
                </mat-option>
            </mat-select>
        </mat-form-field>
    </div>
</div>

Quiero agregar un nuevo valor a esta lista y también hacerlo como valor seleccionado.

¿Cómo puedo hacer eso?

Tags:  , , , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Para agregar un nuevo valor a la lista en mat-select y hacerlo como un valor seleccionado, puedes hacer lo siguiente:

    1. Primero, debes actualizar el origen de datos añadiendo el nuevo valor a la lista de opciones. Supongamos que quieres agregar una nueva opción con un valor de “newOption” y una descripción de “Nueva opción”, lo agregarías al arreglo ListOfSelect: 
      this.ListOfSelect.push({code: 'newOption', descp: 'Nueva opción'});
    2. Para hacer que la nueva opción sea seleccionada, debes actualizar el valor del control del formulario, estableciéndolo en el valor de la nueva opción: 
      this.frmControl.setValue('newOption');

    Esto agregará la nueva opción a la lista y la hará seleccionada. Asegúrate de agregar este código en un lugar apropiado, como en un evento de clic del botón u otro evento apropiado para tu caso de uso.

Comments are closed.