0

プロファイルデータをfirebaseに保存し、

それらを取得して、スライド付きのテンプレートで表示しようとしています。(マッチングサービスを行っております。)

しかし、データが変数に割り当てられる前にテンプレートがロードされているようです。

リストではなく、1つのデータを取得するだけの場合、

それは正常に動作します。

グールですべてのソリューションを試しましたが、

「NgZone」、*ngIf などを使用するのと同じですが、何も機能しませんでした。

私を助けてください。

私のエラーメッセージ。

FindMatePage.html:21 ERROR Error: Error trying to diff '[object Object]'. Only arrays and iterables are allowed
    at DefaultIterableDiffer.diff (core.es5.js:7083)
    at NgForOf.ngDoCheck (common.es5.js:1699)~~

私の find-mate.ts ファイル。

export class FindMatePage implements OnInit{
@ViewChild('profileSlide') slider: Slides;

profileList = [] as  Profile[];
constructor(public navCtrl: NavController, public navParams: NavParams,
private databaseService: DataServiceProvider, private auth: 
AuthServiceProvider,
) {}


ngOnInit(){
this.auth.getActiveUser().getIdToken()
.then((token: string) => (
  this.databaseService.fetchProfileList(token)
    .subscribe((list: Profile[]) => {
      if(list) {
        this.profileList = list;
        console.log(this.profileList)
      } else {
        this.profileList = [];
      } 
    })
))//then ends
}  

私の find-mate.html ファイル

<ion-content class="tutorial-page">
<ion-slides *ngIf="profileList" #profileSlide pager 
(ionSlideDidChange)="slideChanged()">
<ion-slide>
  <h2 class="profile-title">Ready to Play?</h2>
  <button ion-button large clear icon-end color="primary">
    Continue
    <ion-icon name="arrow-forward"></ion-icon>
  </button>
</ion-slide>

<ion-slide *ngFor="let profile of profileList">

  <ion-buttons block>
    <button ion-button color="primary">채팅하기</button>
  </ion-buttons>
  <ion-item> {{profile.username}}</ion-item>
  <ion-item> {{profile.gym}</ion-item>
  <ion-item> {{profile.goal}}</ion-item>
  <ion-item> {{profile.level}}</ion-item>

</ion-slide>

data-service.ts ファイルの私の部分

//프로필 목록 가져오기
fetchProfileList(token: string) {
    return this.http.get('https://fitmate-16730.firebaseio.com/profile-list.json?auth=' + token)
        .map((response: Response) => {
            return response.json();
        })
        .do((profileList: Profile[]) => {
            if (profileList) {
                console.log(profileList);
                return this.profileList = profileList;
            } else {
                return this.profileList = null;
            }
        });
}
4

0 に答える 0