Угловая проблема с 2 вариантами выбора и значением по умолчанию - PullRequest
Новая
       27

Угловая проблема с 2 вариантами выбора и значением по умолчанию

0 голосов
/ 23 ноября 2018

У меня проблема с выбором входа в угловых 7. У меня есть 2 выбора.Когда я выбираю вариант второго выбора, список его соответствующих значений отображается в верхнем входе выбора.И должно быть значение по умолчанию, отображаемое как заполнитель («выбрать»).Но проблема в том, что когда я переключаюсь с одного значения на другое при втором выборе, заполнитель («выбор») в первом выборе становится первым индексным значением списка: 

<select class="dropdown-select" formControlName="street-dd">
  <option class="dropdown-select" disabled selected [ngValue]="null">Select</option>
    <option class="dropdown-select"  *ngFor="let street of retrievedStreets">{{street}}</option>
</select>

<select class="dropdown-select"(change)="onCitySelected($event)" formControlName="city">
  <option class="dropdown-select" *ngFor="let city of retrievedCities" [value]="city['city']">{{city["city"]}}</option>
</select>

Здесь TSfile: 

export class AddressComponent  {
  public retrievedCities: Array<any> = [];
  public retrievedStreets: Array<any> = [];

 private retrieveCities(cities: any) {
    this.retrievedCities = [];
    if (cities && cities.length > 0) {
      this.retrievedCities = cities;
    } 
  }

  public onCitySelected(city) {
    this.retrievedStreets = null;
      this.retrievedStreets = this.lookupStreets(city);
      console.log('retrieved street', this.retrievedStreets);
    this.retrievedStreets = this.retrievedStreets.sort();
  }

  private lookupStreets(city): Array<any> {
    return find(this.retrievedCities, {'city': city.target.value})['streets'];
  }
}

В начале нет проблемы, значение по умолчанию отображается как заполнитель:

enter image description here

Но тогда, когдая выбираю значение выбранной улицы внутри раскрывающегося списка, а затем нажимаю другое значение выбора города, первый индекс списка улиц отображается в качестве заполнителя, а в раскрывающемся списке отключается «выбор»:

enter image description here

и когда я нажимаю на раскрывающийся список улиц, я получаю:

  • Выбор // который отключен
  • CH DU LAC-A-L'ORIGINAL
  • RUE MAUDE
  • и т.д ...

Как я могу заставить улицу выбирать, чтобы поставить "выбрать" в качестве заполнителя значения по умолчанию каждый раз, когда я переключаю опцию города ???

1 Ответ

0 голосов
/ 27 ноября 2018

На самом деле есть решение :) Просто нужно сбросить formcontrol в случае реактивных форм:

this.yourFormGroup.get ('nameOfYourFormControl'). Reset ()

Тогдазначение по умолчанию будет восстановлено снова.

Надеюсь, это когда-нибудь кому-нибудь поможет

...