离子2数据显示一些时间,有些时间没有

时间:2017-05-06 15:12:40

标签: angular typescript ionic-framework ionic2 hybrid-mobile-app

我已经搜索并完成了一些API调用来显示数据。但是现在当我在浏览器或Android设备上运行它的某些时候它显示,有时它没有显示,这意味着数据尚未在屏幕上加载。

这是我的两个屏幕完整代码,包括API调用:

我的src/provider/authservices.ts下的api调用代码:

import { Injectable } from '@angular/core';
import { Http, Headers } from '@angular/http';
import 'rxjs/add/operator/map';


let apiUrl = 'http://www.example.com/api/';
@Injectable()
export class AuthService {
data: any;

  constructor(public http: Http) {}
 categ(cat: any) {
    return new Promise((resolve, reject) => {
        let headers = new Headers();
        headers.append('Content-Type', 'application/json');

        this.http.post(apiUrl+'categories.php', JSON.stringify(cat), {headers: headers})
          .subscribe(res => {
            resolve(res.json());
          }, (err) => {
            reject(err);
          });
    });
  }

   allresources(allres: any) {
    return new Promise((resolve, reject) => {
        let headers = new Headers();
        headers.append('Content-Type', 'application/json');

        this.http.post(apiUrl+'AllResources.php', JSON.stringify(allres), {headers: headers})
          .subscribe(res => {
            resolve(res.json());
          }, (err) => {
            reject(err);
          });
    });
  }

}

接下来是我的schudle.ts

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) {


       }

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

    }); 

opndetailpage() {
  console.log("button pressed");
  //this.navCtrl.push(SpeakerListPage, ResourcePage);

  this.navCtrl.push(SpeakerListPage).then(
      response => {
        console.log('Response ' + response);
      },
      error => {
        console.log('Error: ' + error);
      }
    ).catch(exception => {
      console.log('Exception ' + exception);
    });
}

我的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>

然后我的detail page .ts

this.authService.allresources(this.resloginData).then((result) => {
   this.loading.dismiss();

      this.resdata = result;

       if(this.resdata.status == 1)
       {
       this.resCatdata = this.resdata.SubjectList;
           for(let i=0; i<this.resCatdata.length; i++) {
              // console.log(this.resCatdata[i].FileName);
           }



       }

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

       }

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

    });

就是这样。有时如果我也导航到详细信息页面,则某些时间数据不会显示。我是错误地调用API还是需要添加一些加载的数据?

0 个答案:

没有答案