Question

我有一个下拉菜单和文本框，称为办公室名称和密码。如果我更改密码，则应该更改下拉办公室名称。对于一个密码，可以有多个办公室名称

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，请参阅

Answer 1

OP并不清楚您到底在寻找什么。但是我想您想要的是，当您更改文本字段中的密码时，“选择列表”中的选项也会更改。

如果这是您真正想要的，那么您可以执行以下操作：

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)">

这是您推荐的Working Sample StackBlitz。

onchange函数不适用于有角js

1 个答案: