Question

我的Angular 4，Firebase，AngularFire离子应用程序存在问题，带有可观察的firebase请求。

问题是我第一次点击视图时卡片没有加载，但是如果我去了其他页面然后再回来再次点击那么图片加载没有问题但是第一次我clic after离子服务卡从不加载。

我有2个提供者，第一个提供者是从视图控制器gdm1.ts调用的，调用是：

constructor(
private dbCards: CardsProvider,
...
){...}
...
ionViewDidLoad() {
this.cards = this.dbCards.loadcards(9);
}

这称第一个提供者为card.ts：

constructor(private dbhDb: FirebaseDbProvider) {}
...

loadcards(colnumber)
{
  this.dbhDb.getCards().first().subscribe(cards=>{  
    this.cards = cards[colnumber].cards;
  });
  return this.cards;
}

并且cards.ts调用第二个提供者firebase-db.ts：

constructor(
  public afDB: AngularFireDatabase, 
  public auth: AuthProvider
) {...}
...
getCards(){
 return this.afDB.list('/cards');;
}

Answer 1

在收到回复之前，您正在退回卡片。你需要在.subscribe（）中返回卡片。记住，你的代码是assync。

constructor(private dbhDb: FirebaseDbProvider) {}
...

loadcards(colnumber)
{
  this.dbhDb.getCards().first().subscribe(cards=>{  
    this.cards = cards[colnumber].cards;
  });
  return this.cards;
}

Answer 2

我无法获取您的所有代码，但我确信这些代码运行良好。：）

gdm1.ts

constructor(
private dbCards: CardsProvider,
...
){...}
...
ionViewDidLoad(cardNum) {
this.cards = this.dbCards.loadcards().subscribe(
    card => {
        //get card info
        this.cards = card[cardNum].cards;
    }
);
}

cards.ts：

constructor(private dbhDb: FirebaseDbProvider) {}
...

loadcards()
{
  //return observable;
  return this.dbhDb.getCards().first();
}

火力-db.ts：

constructor(
  public afDB: AngularFireDatabase, 
  public auth: AuthProvider
) {...}
...
getCards(){
 return this.afDB.list('/cards');;
}

PS：如果要将提供程序定义为初始化firebase数据并保留数据。

当组件需要数据时，组件在提供程序中调用getData函数。你应该使用EventEmitter。然后，无论何时更新firebase数据，您都可以获取更新组件数据的事件。

Angular 4 firebase数据可观察错误实现？数据未在第一时间加载

2 个答案: