Búsqueda de sitios web

typescript - Obtener el valor del elemento select en Angular 5


Tengo una lista desplegable de marcas de automóviles y quiero pasar el valor de la marca de automóvil seleccionada al método getCarModelsByBrand(brand). Cualquier ayuda sería muy apreciada.

<div class="form-group">
      <select (change)="getCarModelsByBrand($event.target.value)" class="form-control" id="sel1">
        <option selected="" value="" selected disabled>Pasirinkite</option>
        <option *ngFor="let brand of brands" value=brand>{{brand}}</option>
      </select>
</div>

Respuesta #1

Usa ngModel con enlace bidireccional y enlázalo a una propiedad/campo en el componente junto con ngModelChange para activar cuando la selección ha cambiado.

<select [(ngModel)]="modelOfSelectedBrandToBindTo" (ngModelChange)="getCarModelsByBrand($event)" id="sel1" name="sel1">
  <option value="" disabled>Pasirinkite</option>
  <option *ngFor="let brand of brands" [value]="brand">{{brand}}</option>
</select>

Eliminé el código que no era necesario en el ejemplo para ilustrar el punto

Respuesta #2

Aquí está el mío y funciona. Mi sitio personal con la lista de selección de países para el globo.

<select (change)="selectCountry($event)" title="Select a country">
      <option *ngFor="let country of countryList">{{country.name}} 
      </option>
</select>


selectCountry(event) {

   let fireboxFix = event.target || event.srcElement;
   let indexToFind = (<HTMLSelectElement>fireboxFix).value;
   let testArray = [];
   for (let row of this.countryList) {
      testArray.push(row.name)
   }
   this.changeI = testArray.indexOf(indexToFind);
}