Ионный выбор не меняется на правильные значения при изменении - PullRequest
1 голос
/ 22 мая 2019

У меня есть ion-select, где при изменении мне нужно обновить значения в других ion-select, которые связаны.

Первый ion-select предназначен для выбора стран, затем в соответствии с указанной,второй ion-select отобразит связанные с ними крупные города.

Проблема, связанная с отображением городов, всегда связана с одним из следующих массивов: kuwait_ar, за исключением страны Кувейт, где города являются правильными.kuwait_en.

Здесь stackblitz .

Вот код для (ionChange):

displayCities()
  {
    let country = this.formGroup.controls.country.value;
    this.cityArray = [];
    //console.log(country)
    this.cityArray = ((country == "Bahrain" || country == "البحرين") && this.lang=="en")?this.bahrain_cities_en:this.bahrain_cities_ar;
    this.cityArray = ((country == "Oman" || country == "عمان") && this.lang=="en")?this.oman_cities_en:this.oman_cities_ar;
    this.cityArray = ((country == "Qatar" || country == "قطر") && this.lang=="en")?this.qatar_cities_en:this.qatar_cities_ar;
    this.cityArray = ((country == "Saudi Arabia" || country == "المملكة العربية السعودية") && this.lang=="en")?this.ksa_cities_en:this.ksa_cities_ar;
    this.cityArray = ((country == "UAE" || country == "الامارات العربية المتحدة") && this.lang=="en")?this.uae_cities_en:this.uae_cities_ar;
    this.cityArray = ((country == "Kuwait" || country == "الكويت") && this.lang=="en")?this.kuwait_cities_en:this.kuwait_cities_ar;
    //console.log(this.cityArray)

  }

1 Ответ

0 голосов
/ 23 мая 2019

Ваша проблема возникает из-за того, что вы назначаете this.cityArray несколько раз. Причина, по которой «Кувейт» работает правильно, заключается в том, что он последний в списке.

Учитывайте, когда вы выбираете «Бахрейн»:

#1  this.cityArray = ((country == "Bahrain" || country == "البحرين") && this.lang=="en")?this.bahrain_cities_en:this.bahrain_cities_ar;
#2  this.cityArray = ((country == "Oman" || country == "عمان") && this.lang=="en")?this.oman_cities_en:this.oman_cities_ar;
#3  this.cityArray = ((country == "Qatar" || country == "قطر") && this.lang=="en")?this.qatar_cities_en:this.qatar_cities_ar;
#4  this.cityArray = ((country == "Saudi Arabia" || country == "المملكة العربية السعودية") && this.lang=="en")?this.ksa_cities_en:this.ksa_cities_ar;
#5  this.cityArray = ((country == "UAE" || country == "الامارات العربية المتحدة") && this.lang=="en")?this.uae_cities_en:this.uae_cities_ar;
#6  this.cityArray = ((country == "Kuwait" || country == "الكويت") && this.lang=="en")?this.kuwait_cities_en:this.kuwait_cities_ar;

Строка # 1 правильно устанавливает this.cityArray = this.bahrain_cities_er, потому что ваше условие (country == "Bahrain" оценивается как true И this.lang установлено в "en" ... ХОРОШО

Но ... Строка # 2, (country == "Oman" || country == "عمان") оценивается как false, поэтому вы переназначаете значение this.cityArray = this.oman_cities_ar

То же самое относится и к строке № 3- № 6, поэтому последняя строка присваивает ее this.kuwait_cities_ar, как вы уже видели.

Возможно, оператор switch сработает лучше, когда будет выполнен только один раз.

Однако ваш подход очень сложный. Вы можете структурировать свои определения названий стран / городов в виде вложенного массива или карты, чтобы вы могли просто «искать» правильный список, а не «выяснять его» на основе выбранного значения. Вы также можете создать два отдельных списка, по одному для каждого языка, а затем просто поменять их местами на основе текущего языка.

...