[英]Cannot find a differ supporting object '[object Object]' of type 'object'. NgFor only supports binding to Iterables such as Arrays
I am building an angular2 app which uses webapi for its data. 我正在构建一个使用webapi为其数据的angular2应用程序。 App is having 3 dropdowns which are dependent on the previous value of the dropdown.
应用程序有3个下拉菜单,具体取决于下拉菜单的先前值。
I am able to get the states data but when i select any of the states then it throws error. 我能够获取状态数据,但是当我选择任何状态时,它将引发错误。
Typescript
打字稿
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
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 Data(counties)
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 Data(states)
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.
The error mostly gives it away. 该错误大都可以解决。 You are trying to do an ngFor on an Object, not an array.
您正在尝试在对象而不是数组上执行ngFor。 You need to convert your objects to arrays.
您需要将对象转换为数组。 Try using
JSON.parse(yourObjectHere)
尝试使用
JSON.parse(yourObjectHere)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.