如何调用对象值ionic 2

Question

完成api调用后。在我的数据库中，我有一组json对象值。结构如下：

{ 
    "status": 1, 
    "message": "List Successfully fetched", 
    "CatgeoryList": [ 
    { 
     "CatID": "10" 

    }, 
{ 
     "CatID": "30" 

    }, 
{ 

    "CatID": "0" 

    }] 
} 

我已经完成了api调用。我得到了status == 1。我可以打印CatgeoryList中的所有对象值。但我想打印所有catID中的IN CatgeoryList。我无法得到。

这里我的代码：

this.authService.categ(this.loginData).then((result) => { 
     this.loading.dismiss(); 
     this.data = result; 

     if(this.data.status == 1) 
     { 
     this.Catdata = this.data.CatgeoryList; 
     console.log(this.Catdata); // i am getting all data 

     this.Catdatanames = this.Catdata.CatID; // not working 
     console.log(this.Catdata.CatID); // not working 
} 
} 

我想要得到的catID下CatgeoryList。

更新：更新的

home.html的：

<div class="item item-body no-padding" style="border-width: 0px !important;"> 

    <div class="row no-padding" *ngFor="let data of Catdata;let i = index" (click)="opndetailpage()"> 
    <ng-container *ngIf=" i % 2 === 0"> 

      <div class="col col-50 custom-design2" style="background: url(url) no-repeat center;background-size: cover;"> 
       <div class="custom-design1"><span class="grid-title">{{Catdata[i].CategoryName}}</span></div> 
      </div> 

      <div class="col col-50 custom-design2" style="background: url(url) no-repeat center;background-size: cover;"> 
       <div class="custom-design1"><span class="grid-title">{{Catdata[i+1].CategoryName}}</span></div> 
      </div> 


    </ng-container> 
</div> 


</div> 

home.ts

constructor(
    public alertCtrl: AlertController, 
    public app: App, 
    public loadingCtrl: LoadingController, 
    public modalCtrl: ModalController, 
    public navCtrl: NavController, 
    public toastCtrl: ToastController, 
    public confData: ConferenceData, 
    public user: UserData, 
    public http:Http, 
    public authService: AuthService 
) { 

this.showLoader(); 
    this.authService.categ(this.loginData).then((result) => { 
     this.loading.dismiss(); 
     this.data = result; 

     if(this.data.status == 1) 
     { 
     this.Catdata = this.data.CatgeoryList; 


      for(let i=0; i<this.Catdata.length; i++) { 
       console.log(this.Catdata[i].CategoryName); 
      } 



     } 

     else if(this.data.status == 0) { 

    let alert = this.alertCtrl.create({ 
    title: 'Error', 
    subTitle: 'Please Enter Valid Username & Password', 
    buttons: ['OK'] 
    }); 
    alert.present(); 
     } 

    }, (err) => { 
     this.loading.dismiss(); 

    });  

    } 

我takeexam.html

<ion-buttons> 
<button (click)="canceltap()" style="font-size: 15px;text-transform: none;" ion-button>Cancel 
    </button> 
    </ion-buttons> 

我takeexam.ts

canceltap() { 
    // this.navCtrl.pop(); 
    console.log("pop tap"); 
    this.navCtrl.setRoot(TabsPage); .// this is my home page 


    } 

所以当我按下取消按钮takeexam.html其将A型行为[age.html（主页）。但是没有数据显示。我只是用硬编码在我的主页上尝试了一些价值。那次我按取消按钮显示所有数据。

所以我发现问题是在ionviewdidload或其他一些数据。我试过了。 ionViewDidEnterionDidLoad。但没有任何工程

Answer 1

由于this.data.CatgeoryList是一个数组，你需要使用一个循环做一些与每个项目

this.authService.categ(this.loginData).then((result) => { 
     this.loading.dismiss(); 
     this.data = result; 

     if(this.data.status == 1) { 
      // this.Catdata is an array 
      this.Catdata = this.data.CatgeoryList; 

      // Use a loop to print the items 
      for(let i=0; i<this.Catdata.length; i++) { 
       console.log(this.Catdata[i].CatID); 
      } 
     } 
} 

如果你要显示它在视图中，可以使用ngFor像这

<ion-list> 
    <ion-item *ngFor="let item of Catdata"> 
     {{ item.CatID }} 
    </ion-item> 
</ion-list> 

UPDATE

但是如果我想通过onclikc获取catID。意味着我需要通过 该catID到我的另一页的手段。离子2通过（点击）如何传递 这个CATID转下页

更新视图

<ion-list> 
    <ion-item (click)="showDetails(item.CatID)" *ngFor="let item of Catdata"> 
     {{ item.CatID }} 
    </ion-item> 
</ion-list> 

您可以在组件代码添加一个新方法

public showDetails(catId: any): void { 
    this.navCtrl.push(AnotherPage, { catId: catId }); 
} 

而且在第二页中的构造函数中，通过使用获取数据NavParams

constructor(public params: NavParams){ 
    // userParams is an object we have in our nav-parameters 
    this.catId = this.navParams.get('catId') 
}