如何使用firebase数组进行ng-repeat?

时间:2017-03-10 11:48:31

标签: javascript firebase firebase-realtime-database

上下文

在Firebase数据库中,我正在存储“事件”和“用户”。用户可以拥有喜欢的事件来管理它们我只将事件的id存储在收藏用户的DB位置。因此,为了获取最喜欢的事件信息,我需要首先获取事件ID,然后转到DB事件位置,以收集我需要的所有数据。

enter image description here

问题

我想在数组中存储所有喜欢的事件信息(每个事件都是一个包含在其中的对象:“key”:“value”),在我的HTML视图中使用该数组并打印信息。但它不能像我编码那样工作...... :(

   // This ref is too grab favorite event id (in my case only 2) in the user DB location
    var refUserFavoris = firebase.database().ref().child("users/"+user.uid+"/events/favoris"); 
    $scope.favorisTmp = $firebaseArray(refUserFavoris);

    // This shows one array, with two objects (wich are my two user's favorite events) wich include ids
    console.log($scope.favorisTmp);

    // This is to load the objects and with the foreEach, grab there ids to use them in the next ref call
    $scope.favorisTmp.$loaded().then(function() 
    {
            angular.forEach($scope.favorisTmp, function(favoris) 
            {
                // This shows two lines : the id of each object
                console.log(favoris.$id);

                // Call a new ref to reach the event informations (in a different location of the DB) using the previous id
                firebase.database().ref("events/"+favoris.$id).once('value').then(function(snapshot) 
                {
                    // Attempt to store events datas for each id I have (in my case, only two)
                    snapshot.forEach(function(favorisSnap) 
                    {
                        var favSnap = favorisSnap.val();

                        // This shows a lot of "undefined" lines, wich I don't want. I would like two objects, with all informations inside
                        console.log(favSnap.nbPersonne);

                        // $scope.favorisF is an Array that I would like to use in a ng-repeat to print all datas for each event
                        // For now this doesn't show anything
                        $scope.favorisF = favSnap;
                    });

                    // If using favSnap out of the previous function, I got a "favSnap" is undifined error
                    console.log(favSnap);
                });
            });
    });
<ion-item ng-repeat="f in favorisF" class="item-avatar">
    {{f.nbPersonne}}
</ion-item>

编辑1:

我尝试了一种获取数据的新方法,但是出现了一个新问题,如何在循环中填充数组?我尝试过“push”和“$ add”方法,但没有人工作。有什么想法吗?

        var newFav = [];
        var user;
        user = firebase.auth().currentUser;
        var refUserFavoris = firebase.database().ref().child("users/"+user.uid+"/events/favoris");
        
        $scope.favorisTmp = $firebaseArray(refUserFavoris);
        
        $scope.favorisTmp.$loaded().then(function()
        {
                angular.forEach($scope.favorisTmp, function(favoris) 
                {
                    console.log(favoris.$id);
                    var refFavoris = firebase.database().ref("events/"+favoris.$id);
                    refFavoris.on('value', function(snap)
                    {
                       //This is where I'm trying to fill "newFav" in each steps of the loop
                       newFav.push(snap.val());
                       console.log("Scope newFav vaut :", $scope.newFav);
                    });
                });
        });

2 个答案:

答案 0 :(得分:1)

我认为你在这里打错了。

var refUserFavoris = firebase.database().ref("events/favoris/"+favoris.$id).once('value')

答案 1 :(得分:1)

非常感谢Abdel,我解决了我的问题:

以下是解决方案

&#13;
&#13;
$scope.newFav = [];
        console.log($scope.newFav);
        
        $scope.favorisTmp.$loaded().then(function()
        {
                angular.forEach($scope.favorisTmp, function(favoris) 
                {
                    console.log(favoris.$id);
                    var refFavoris = firebase.database().ref("events/"+favoris.$id);
                    refFavoris.on('value', function(snap)
                    {
                       $scope.newFav.push(snap.val());
                       console.log("Scope newFav vaut :", $scope.newFav);
                    });
                });
        });
&#13;
&#13;
&#13;