我正在构建一个使用webapi作为其数据的angular2应用程序。应用程序有3个下拉列表,这取决于下拉列表的先前值
我能够获取状态数据,但是当我选择任何状态时,它会抛出错误。
打字稿
public states; public counties; public cities; sState={}; sCounty={}; sCity={};
initializeState() {
this.zipcode.getStates() .subscribe(data=>{ this.states=data; })
setCountyValues(sState) { this.selectedCounties=this.service.getCounties(sState) .subscribe(data=>{
this.selectedCounties=data; })
}
setCityValues(sCounty) {
this.selectedCities = this.service.getCities(sCount)
.subscribe(data=>{
this.selectedcities=data;})
}
HTML 的
<ion-item>
<ion-label>State</ion-label>
<ion-select (ionChange)="setCountyValues(sState.StateAbbr)" [(ngModel)]="sState" >
<ion-option [value]="sState" *ngFor="let sState of states" [selected]="sState">{{sState.StateName}}</ion-option>
</ion-select>
</ion-item>
<ion-item >
<ion-label>Counties</ion-label>
<ion-select (ionChange)="setCityValues(sCounty.County)" [(ngModel)]="sCounty">
<ion-option [value]="sCounty" *ngFor="let sCounty of selectedCounties" [selected]="sCounty">{{sCounty.County}}</ion-option>
</ion-select>
</ion-item>
<ion-item *ngIf="selectedCities">
<ion-label>Cities</ion-label>
<ion-select [(ngModel)]="sCity">
<ion-option [value]="sCity" *ngFor="let sCity of selectedCities" [selected]="sCity">{{sCity.name}}</ion-option>
</ion-select>
</ion-item>
JSON数据(县)
[{"Id":210,"PageRec":"AZ005","PageEx":"AZ005","PageGfe":"AZ005","State":"Arizona","County":"Apache","CountyFips":"04001","Juris":"Apache","RecName":"Apache County","JurisType":"County","StateAbbrv":"AZ","GfeName":"Apache County","StateFips":"4","OfficeCode":" ","OfficeNote":" ","C1":" ","SubJuris":" ","PageRecName":"AZ005:Apache County"},{"Id":211,"PageRec":"AZ006","PageEx":"AZ006","PageGfe":"AZ006","State":"Arizona","County":"Cochise","CountyFips":"04003","Juris":"Cochise","RecName":"Cochise County","JurisType":"County","StateAbbrv":"AZ","GfeName":"Cochise County","StateFips":"4","OfficeCode":" ","OfficeNote":" ","C1":" ","SubJuris":" ","PageRecName":"AZ006:Cochise County"},{"Id":212,"PageRec":"AZ007","PageEx":"AZ007","PageGfe":"AZ007","State":"Arizona","County":"Coconino","CountyFips":"04005","Juris":"Coconino","RecName":"Coconino County","JurisType":"County","StateAbbrv":"AZ","GfeName":"Coconino County","StateFips":"4","OfficeCode":" ","OfficeNote":" ","C1":" ","SubJuris":" ","PageRecName":"AZ007:Coconino County"},{"Id":213,"PageRec":"AZ008","PageEx":"AZ008","PageGfe":"AZ008","State":"Arizona","County":"Gila","CountyFips":"04007","Juris":"Gila","RecName":"Gila County","JurisType":"County","StateAbbrv":"AZ","GfeName":"Gila County","StateFips":"4","OfficeCode":" ","OfficeNote":" ","C1":" ","SubJuris":" ","PageRecName":"AZ008:Gila County"}]
JSON数据(状态)
[{"StateID":2,"StateAbbr":"AL","StateName":"Alabama","IconFileName":null,"CreatedOn":null,"ModifiedOn":null,"NonState":0,"IsCanada":0},{"StateID":1,"StateAbbr":"AK","StateName":"Alaska","IconFileName":null,"CreatedOn":null,"ModifiedOn":null,"NonState":0,"IsCanada":0},{"StateID":4,"StateAbbr":"AZ","StateName":"Arizona","IconFileName":null,"CreatedOn":null,"ModifiedOn":null,"NonState":0,"IsCanada":0},{"StateID":3,"StateAbbr":"AR","StateName":"Arkansas","IconFileName":null,"CreatedOn":null,"ModifiedOn":null,"NonState":0,"IsCanada":0}]
ERROR
Error:Cannot find a differ supporting object 'Response with status: 200 OK for URL: http://localhost:58682/home/GetCounties/?stateAbbr=AZ' of type 'object'. NgFor only supports binding to Iterables such as Arrays.
答案 0 :(得分:0)
错误主要是让它消失。您正在尝试对对象而不是数组执行ngFor。您需要将对象转换为数组。尝试使用JSON.parse(yourObjectHere)