该应用程序在ionic2中。 这是从服务器获取数据的服务提供商。 我希望能够将数据调用到下拉列表中,但显示为空。
index(url){
let username: string = 'admin';
let password: string = 'password';
let headers: Headers = new Headers();
headers.append("Authorization", "Basic " + btoa(username + ":" + password));
headers.append("Content-Type", "application/json");
return this.http.get(server + url + addon, {headers: headers})
}
这是从服务器获取数据的api调用函数。
getOfficeID(){
this.loading =this.loadingCtrl.create({
content:"Getting form ready..."
});
this.loading.present();
this.auth.index('offices').subscribe((response) => {
console.log(response);
this.data = response;
setTimeout(()=>{
this.id = response;
this.branches = Object.keys(this.data);
this.loading.dismissAll();
},7000)
},error=>{
this.toastrCtrl.messenger('Connection Failed');
console.log(error);
alert(JSON.stringify("Error is :" + error));
})
}
这是绑定api的响应以创建下拉列表。
<ion-item *ngIf="branches" >
<ion-label floating>Office Branch</ion-label>
<ion-select [class.invalid]="!regForm.controls.officeId.valid && (regForm.controls.officeId.dirty || submitAttempt)" formControlName="officeId" >
<ion-option *ngFor="let branch of branches; let i = index" value="{{branch.id}}">{{branch.name}}</ion-option>
</ion-select>
</ion-item>
<ion-item *ngIf="!regForm.controls.officeId.valid && (regForm.controls.officeId.dirty || submitAttempt)">
<p>Please choose a Region.</p>
</ion-item>
这是json输出。
Object { _body: "[{\"id\":1,\"name\":\"Head Office\",\"nameDecorated\":\"Head
Office\",\"externalId\":\"1\",\"openingDate\":
[2009,1,1],\"hierarchy\":\".\"},{\"id\":10,\"name\":\"Greater Accra
Region\",\"nameDecorated\":\"....Greater Accra Region\",\"openingDate\":
[2018,7,31],\"hierarchy\":\".10.\",\"parentId\":1,\"parentName\":\"Head
Office\"},{\"id\":2,\"name\":\"Northern
Region\",\"nameDecorated\":\"....Northern Region\",\"openingDate\":
[2018,7,31],\"hierarchy\":\".2.\",\"parentId\":1,\"parentName\":\"Head
Office\"},{\"id\":11,\"name\":\"Airport
office\",\"nameDecorated\":\"........Airport office\",\"externalId\":\"SYS54-
88\",\"openingDate\":
[2018,7,31],\"hierarchy\":\".2.11.\",\"parentId\":2,\"parentName\":\"Northern
Region\"},{\"id\":3,\"name\":\"Brong Ahafo
Region\",\"nameDecorated\":\"....Brong Ahafo Region\",\"openingDate\":
[2018,7,31],\"hierarchy\":\".3.\",\"parentId\":1,\"parentName\":\"Head
Office\"},{\"id\":4,\"name\":\"Ashanti
Region\",\"nameDecorated\":\"....Ashanti Region\",\"openingDate\":
[2018,7,31],\"hierarchy\":\".4.\",\"parentId\":1,\"parentName\":\"Head
Office\"},{\"id\":5,\"name\":\"Western
Region\",\"nameDecorated\":\"....Western Region\",\"openingDate\":
[2018,7,31],\"hierarchy\":\".5.\",\"parentId\":1,\"parentName\":\"Head
Office\"},{\"id\":6,\"name\":\"Volta Region\",\"nameDecorated\":\"....Volta
Region\",\"openingDate\":
[2018,7,31],\"hierarchy\":\".6.\",\"parentId\":1,\"parentName\":\"Head
Office\"},{\"id\":7,\"name\":\"Eastern
Region\",\"nameDecorated\":\"....Eastern Region\",\"openingDate\":
[2018,7,31],\"hierarchy\":\".7.\",\"parentId\":1,\"parentName\":\"Head
Office\"},{\"id\":8,\"name\":\"Upper West
REgion\",\"nameDecorated\":\"....Upper West REgion\",\"openingDate\":
[2018,7,31],\"hierarchy\":\".8.\",\"parentId\":1,\"parentName\":\"Head
Office\"},{\"id\":9,\"name\":\"Central
Region\",\"nameDecorated\":\"....Central Region\",\"openingDate\":
[2018,7,31],\"hierarchy\":\".9.\",\"parentId\":1,\"parentName\":\"Head
Office\"}]", status: 200, ok: true, statusText: "OK", headers: {…}, type: 2,
url: "https://xx.xx.xx.xx:xxxx/fineract-provider/api/v1/offices?
tenantIdentifier=default" }
signup.ts:44:6