Question

该应用程序在离子2中。这是从服务器获取数据的服务提供商。我希望能够将数据调用到下拉列表中，但显示为空。

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://x.x.x.x:7443/fineract-provider/api/v1/offices? 
tenantIdentifier=default" }
signup.ts:44:6

任何帮助将不胜感激。谢谢。

将JSON数据绑定到下拉列表中，显示下拉列表但列表为空

0 个答案: