异步回调返回null [英] asynchronous callback returns null

问题描述

我想指定回调函数值和显示 NG-重复

I am trying to assign callback function values and display ng-repeat

var myApp = angular.module('mybet',[]);

myApp.controller('MyBetController', function($scope,$firebase,ProfileFactory,MybetFactory){

    $scope.myBetEvents = MybetFactory.getUsersBetsProfile(currentLoggedUser, function(betsData){
        //Callback retuning null value here
        $scope.myBetEvents = betsData;
    });

});

myApp.factory('MybetFactory', ['$firebase', function($firebase){

    var factory = {};

    factory.getUsersBetsProfile = function(userId, callback){

        var firebaseRef = new Firebase("https://xxx.firebaseio.com/usersbetsprofile").child(userId);
        var firebaseBetsRef = new Firebase("https://xxx.firebaseio.com/events");
        var userBettedEvent = [];
        //retrive the data
        firebaseRef.on('value', function (snapshot) {
            console.log(snapshot.val());
            var data = snapshot.val();
            if (data){
                //callback(data);
                angular.forEach(data, function(data){
                    console.log('For Each getUsersBets',data);
                    var firebaseEventsData = firebaseBetsRef.child(data.event_id);
                    //retrive the data of bets
                    firebaseEventsData.on('value', function (snapshot) {    
                        userBettedEvent.push(snapshot.val());
                        console.log('userBettedEvent',userBettedEvent);
                        //if I call callback here then i get the values but calling callback multipul time is no the option 
                }, function (errorObject) {
                    console.log('The read failed: ' + errorObject.code);
                    });
                });
                //ISSUE:: callback returing null values
                        callback(userBettedEvent);
            }else{
                console.log('Users has no bets');
            }
        }, function (errorObject) {
            console.log('The read failed: ' + errorObject.code);
            });
    };

    return factory;
}])

查看：

<ul class="list">
        <li class="item" ng-repeat="events in myBetEvents">{{events.event_name}}</li>
 </ul>

如何获取回调（）来考虑返回值与显示？是什么的foreach返回null后造成的回调？

How can get callback() to return values and display in view? what is causing callback after foreach returning null?

推荐答案

作为@ codeR在评论中已经说了，你的回调（userBettedEvent）是错误的地方。在那里你现在拥有它，它会被调用的之前的对（'值'从火力地堡已经完成。

As @coder already said in the comments, your callback(userBettedEvent) is in the wrong place. Where you have it now, it will be invoked before the on('value' from Firebase has completed.

从评论很明显，你已经公告称，但只希望回调调用的一个孩子。你可以简单地使用限制为

From the comments it is clear that you've notice that, yet only want the callback to invoked for one child. You can simply use a limit for that.

像这样将工作：

if (data){
    data.limit(1).on('value', function(childData) {
        var firebaseEventsData = firebaseBetsRef.child(childData.event_id);
        firebaseEventsData.on('value', function (snapshot) {    
            userBettedEvent.push(snapshot.val());
            callback(userBettedEvent);
        }
    })

我还没有真正测试code，但我敢肯定一个限制应该让你在正确的方向。

I haven't really tested the code, but I'm quite sure a limit should get you in the right direction.

作为一个方面说明：你似乎可以用火力地堡作为一个传统的数据库，拉出来的数据就像你使用SQL做的。正如你可能会注意到：这不是火力地堡，这是为了同步数据变化的自然模式。如果你要坚持把数据，您可以考虑使用一次（'值'而不是对（'值'，以确保处理火一次，每尝试从火力地堡提取数据的时间。

As a side note: you seem to be using Firebase as a traditional database, pulling the data out like you'd do with SQL. As you may notice: that is not a natural model for Firebase, which was made to synchronize data changes. If you want to stick to pulling the data, you may consider using once('value' instead of on('value' to ensure the handlers fire only once for every time you try to pull the data from Firebase.

这篇关于异步回调返回null的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！