Question

大家好，我正在尝试使用ionic3和firebase创建一个简单的friendrequests页面

我用ngfor成功列出了用户名。但我无法从我的数据中列出用户FirstName。

列出html：

 <ion-item *ngFor="let friendrequest of friendRequestArray; let name of requesterName; let i = index" (click)="getFirstName(i)">
    <h2>{{friendrequest.$key}}</h2>
    <p> {{name}} </p>
  </ion-item>

构造

  friendRequestArray = [];
  requesterName =[];

  constructor(public navCtrl: NavController, public navParams: NavParams,
    public alertCtrl: AlertController, private afDatabase: AngularFireDatabase, private afAuth: AngularFireAuth) {

      this.myUid = this.afAuth.auth.currentUser.uid;

      this.afDatabase.list(`users/${this.myUid}/friendrequests/`).subscribe(data => {
        this.friendRequestArray = data;
        console.log(this.friendRequestArray);



      });


  }

现在，用户名（friendrequest）工作正常但{{name}}因特定父母而无效。如你所见，有一个通过点击获得名字的功能，它工作正常，并在控制台中返回我想要的用户名。但我希望它在构造函数中，如用户名，每个请求。

获取firstname函数是这样的，它在构造函数中不起作用;

      getFirstName(i) {

    this.afDatabase.object(`users/${this.friendRequestArray[i].$value}/profile`).subscribe(data => {

        this.requesterName = data.firstName;
        console.log(this.requesterName);
    });
  }

感谢阅读请帮助我

Answer 1

为什么不在构造函数中调用它？

this.afDatabase.list(`users/${this.myUid}/friendrequests/`).subscribe(data =>{
    this.friendRequestArray = data;
    console.log(this.friendRequestArray);

    this.friendRequestArray.forEach((item, i) => {
       getFirstName(i);
    })


  });

在getFirstName函数中添加一行，以在friendRequestArray中存储firstName：

getFirstName(i) {

this.afDatabase.object(`users/${this.friendRequestArray[i].$value}/profile`).subscribe(data => {

    this.requesterName = data.firstName;
    console.log(this.requesterName);
    friendRequestArray[i]["firstName"] = data.firstName;
});

}

现在你的html可以是：

<ion-item *ngFor="let friendrequest of friendRequestArray; let i = index">
    <h2>{{friendrequest.$key}}</h2>
    <p> {{friendrequest.firstName}} </p>
  </ion-item>

如何使用* ngFor列出特定数据

1 个答案: