0

我将配置文件数据存储在 firebase 和

试图检索它们并在带有幻灯片的模板中显示它们。（我正在做匹配服务。）

但似乎在将数据分配给变量之前加载了模板。

当我只是检索一个数据而不是列表时，

它工作正常。

我在goole上尝试了所有解决方案，

就像使用 '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