Функция onchange не работает в угловых js - PullRequest
Новая
       34

Функция onchange не работает в угловых js

0 голосов
/ 11 января 2019

У меня есть один выпадающий список и текстовое поле с названием офиса и пин-кодом. Если я меняю пин-код, он должен измениться в выпадающем названии офиса. Для одного пин-кода может быть несколько офисных названий 

onChangePincode() {
  let selectedPinData;
  let pincode
  for (let i = 0; i < this.pincodeDetails.length; i++) {
    if (pincode == this.pincodeDetails[i].pincode) {
      //console.log(this.pincodeDetails[i])
      selectedPinData = this.pincodeDetails[i];
      //console.log(selectedPinData)
      this.pincodeData.push(this.pincodeDetails[i]);
      // console.log(this.pincodeDetails[i])
    }
  }
}

this.pincodeDetails = [{
  id: 1,
  officeName: 'basaveshwara',
  divisionName: 'Basaveshwarnagar',
  regionName: 'North Karnatka',
  circleName: 'karnatka',
  pincode: '560059'
}, {
  id: 2,
  officeName: 'basaveshwara',
  divisionName: 'Vijaynagar',
  regionName: 'North Karnatka',
  "circleName": 'karnatka',
  pincode: '560079'
}, {
  id: 4,
  officeName: 'Malleshwaram',
  divisionName: 'Rajajinagar',
  regionName: 'south Karnatka',
  circleName: 'karnatka',
  pincode: '560059'
}, {
  id: 1,
  officeName: 'basaveshwara',
  divisionName: 'Basaveshwarnagar',
  regionName: 'North Karnatka',
  circleName: 'karnatka',
  pincode: '560078'
}]

и я написал JSON, пожалуйста, обратитесь

1 Ответ

0 голосов
/ 11 января 2019

Из ОП не совсем понятно, что именно вы ищете. Но я думаю, что вы хотите, чтобы параметры в списке выбора изменялись при изменении пин-кода в текстовом поле.

Если вы действительно этого хотите, вот что вы можете сделать: 

onChangePincode(pincode) {
  this.pincodeData = this.pincodeDetails.filter(office => office.pincode.includes(pincode));
}

И в своем шаблоне вы можете вызвать этот метод для события keyup при вводе текста: 

For Office Name
<select name="" id="">
  <option value="null" disabled>Select an Office</option>
  <option *ngFor="let datum of pincodeData" value="datum.id">{{ datum.officeName }}</option>
</select>

<br><br>

For Pincde
<input type="text" #pincode (keyup)="onChangePincode(pincode.value)">

Вот Рабочий образец StackBlitz для вашей ссылки.

...