我測驗了制作states和city級聯動態下拉串列，我創建了兩個dropdownlist，state并且city，我想填充drowdownlist對應cities的，state但它不起作用，它只是第一次起作用。我不知道如何解決這個問題
選擇.component.ts
ngOnInit(): void {
}
states:any=[
{id: 1,name: "Maharasthra"},
{id: 2,name: "West Bengal"}
];
cities:any=[
{id: 1,name: "Mumbai",state_id:1},
{id: 1,name: "Pune",state_id:1},
{id: 2,name: "Kolkata",state_id:2},
{id: 2,name: "Howrah",state_id:2}
];
onSelect(state:any){
this.cities = this.cities.filter((item:any) => item.state_id == state.target.value);
console.log(state.target.value)
}
select.component.html
<div >
<div >
<label>states <span >*</span></label>
<select (change)="onSelect($event)">
<option [value]="0">--select--</option>
<option [value]="i.id" *ngFor="let i of states" >{{ i.name }}</option>
</select>
</div>
<div >
<label>city <span >*</span></label>
<select >
<option [value]="c.id" *ngFor="let c of cities">{{ c.name }}</option>
</select>
</div>
</div>
uj5u.com熱心網友回復：
問題是您正在覆寫您的城市陣列。您可以嘗試以下方法：
ngOnInit(): void {
}
states:any=[
{id: 1,name: "Maharasthra"},
{id: 2,name: "West Bengal"}
];
allCities = [
{id: 1,name: "Mumbai",state_id:1},
{id: 1,name: "Pune",state_id:1},
{id: 2,name: "Kolkata",state_id:2},
{id: 2,name: "Howrah",state_id:2}
];
cities = []
onSelect(state:any){
this.cities = this.allCities.filter((item:any) => item.state_id == state.target.value);
console.log(state.target.value)
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/450138.html
標籤：有角度的
下一篇：值0顯示在輸入中，如何洗掉它？