Firebase 3获取包含生成的离子列表键的列表答案

【问题标题】：Firebase 3 get list which contain generated keys to ionic listFirebase 3获取包含生成的离子列表键的列表
【发布时间】：2017-01-12 01:32:14
【问题描述】：

我想将 firebase 表与 ionic 列表同步。

这些是数据库中的项目

Items
 -KQpA9YpXyqBQ2HZedEo
       name:     "jhj"
 -KQpAWtIaMeS93431BRQ
       name:     "hj"
 -KQpB6grRt15GnacKHjW
       name:     "j"

这是离子部分

 <ion-list>
     <ion-item ng-repeat="item in items">
          <h2>{{item.name}}</h2>
     </ion-item>
 </ion-list>

这是我的火力基地部分

var itemsRef = firebase.database().ref('Items');

//first try
var items = itemsRef.orderByChild('name');
$scope.items = items;

//this is second try
itemsRef.on('child_added', function (data) {
    $scope.items = data.val();
});

如果我尝试这样的事情，我可以在控制台上看到项目。

 var items = itemsRef.orderByChild('name');

 items.on('child_added', function (snapshot) {
     var obj = snapshot.val();
     console.log(obj);
 });

我需要帮助才能在 ionic 上获取和显示列表。

【问题讨论】：

标签： ionic-framework firebase firebase-realtime-database angularfire

【解决方案1】：

我认为使用 $firebaseObject 更好。

看看这个

var itemsRef = firebase.database().ref('Items');
var items = itemsRef.orderByChild('name');
$scope.items = $firebaseObject(items); // Don't forget to add $firebaseObject in your dependencies of your controller

现在在您看来，您可以执行以下操作

<ion-list>
     <ion-item ng-repeat="(key, item) in items">
          <h2>{{item.name}}</h2>
     </ion-item>
 </ion-list>

您还可以通过写{{key}} 来使用该密钥，如果您需要导航到它的详细信息页面，这很有用。通过使用它，您可以获得所有子事件（添加、更改和删除）

【讨论】：

【解决方案2】：

使用 $firebaseArray 是解决方案

var itemsRef = firebase.database().ref('Items');
var itemsQuery = itemsRef.orderByChild('name');
$scope.items = $firebaseArray(itemsQuery);

Angular Fire Docs

【讨论】：