Unable to get my data from $firebaseObject using AngularFire in a controller. View/ng-repeat works fine

问题

I have different sections in Firebase with normalized data, and I have routines to get the information, but I cannot loop through the returned records to get data. I want to use the keys in the $firebaseArray() to get data from other $firebaseObject().

GetOneTeam() .... {
    var DataRef = GetFireBaseObject.DataURL(Node + '/');  // xxx.firebaseio.com/Schedules/
    var OneRecordRef = DataRef.child(Key); // Schedule Key - 1
    return $firebaseObject(OneRecordRef);
}

...

var Sched = GetOneSchedule('Schedules', 1);
...   // For Loop getting data - Put in HomeId
var TeamRec = GetOneTeam('Teams', HomeId);
var Name = TeamRec.TeamName;    // Does not TeamName value from Schedule/1

The following is more of the actual code in case the snippet above is not clear enough. Sample common routine for getting data:

angular.module('MyApp')
    .constant('FIREBASE_URL', 'https://xxxxxxxx.firebaseio.com/');

angular.module('MyApp')
    .factory('GetFireBaseObject', function(FIREBASE_URL) {
        return {
            BaseURL: function() {
                return new Firebase(FIREBASE_URL);
            },
            DataURL: function(Node) {
                return new Firebase(FIREBASE_URL + Node);
            }
        };
    }
);

// Common code for getting Array/Object from Firebase.  
angular.module('MyApp')
    .factory("FireBaseData", ["$firebaseArray", "$firebaseObject", "GetFireBaseObject", 
    function($firebaseArray, $firebaseObject, GetFireBaseObject) {
        return {
            AllRecords: function(Node) {
                var DataRef = GetFireBaseObject.DataURL(Node + '/');
                return $firebaseArray(DataRef);
            },
            OneRecordAllChildren: function(Node, Key) {
                var DataRef = GetFireBaseObject.DataURL(Node + '/');
                var ParentRecordRef = DataRef.child(Key);
                return $firebaseArray(ParentRecordRef);
            },
            OneRecord: function(Node, Key) {
                var DataRef = GetFireBaseObject.DataURL(Node + '/');
                var OneRecordRef = DataRef.child(Key);
                return $firebaseObject(OneRecordRef);
            },
            AddRecord: function(Node, Record) {
                var DataRef = GetFireBaseObject.DataURL(Node + '/');
                var AddRecordRef = DataRef.child(Record.Key);               
                AddRecordRef.update(Record);
                return $firebaseObject(AddRecordRef);           // Return Reference to added Record
            },
            DeleteRecord: function(Node, Key) {
                var DataRef = GetFireBaseObject.DataURL(Node + '/');
                var DeleteRecordRef = DataRef.child(Key);
                DeleteRecordRef.remove();
            }
        };
    }
]);

Individual Controller's retrieval of records from firebase.io:

angular.module('MyApp').service("ScheduleData", ["FireBaseData",
    function(FireBaseData) {
        var DataPath = 'Schedules';

        this.AllSchedules = function() {
            return FireBaseData.AllRecords(DataPath);
        };

        this.AddSchedule = function(GameInfo) {
            return FireBaseData.AddRecord(DataPath, GameInfo);
        };

        this.DeleteSchedule = function(GameKey) {
            FireBaseData.DeleteRecord(DataPath, GameKey);
        };      

        this.GetOneSchedule = function(GameKey) {
            return FireBaseData.OneRecord(DataPath, GameKey);
        };
    }
]);

// Structure of a record, including named fields to come from another object (Team/Venue using the OneRecord FireBaseData call to get a $firebaseObject
angular.module('MyApp').factory("ScheduleRecord", function() {
        return {
            Clear: function(GameInfo) {
                GameInfo.Key = "";
                GameInfo.HomeTeamId = "";
                GameInfo.HomeTeamName = "";
                GameInfo.AwayTeamId = "";
                GameInfo.AwayTeamName = "";
                GameInfo.VenueId = "";
                GameInfo.VenueName = "";
                GameInfo.GameDate = "";
                GameInfo.GameTime = "";
            }
        };
    }
);

Controller module start:

angular.module('MyApp').controller('ScheduleCtrl', ["$scope", "ScheduleData", "ScheduleRecord", "TeamData", "VenueData",
    function ($scope, ScheduleData, ScheduleRecord, TeamData, VenueData) {

        var ClearEditData = function() {
            $scope.ScheduleEditMode = false;
            ScheduleRecord.Clear($scope.schedule);
        };

        var GameSchedules = ScheduleData.AllSchedules();

This next piece is where my question lies. Once the promise returns the static schedule list, I want to loop through each record and translate the Team Id (Home/Away) and Venue Id to the names.

        GameSchedules.$loaded().then(function() {
            angular.forEach(GameSchedules, function(GameInfo) {
                var HomeTeam = TeamData.GetOneTeam(GameInfo.HomeTeamId);
                GameInfo.HomeTeamName = HomeTeam.Name;

The GetOneTeam returns a $firebaseObject, based on the HomeTeamId child record. This returns null all the time.

This is the TeamData.GetOneTeam return using the FireBaseData as well.

angular.module('MyApp').service("TeamData", ["FireBaseData",
    function(FireBaseData) {
        var DataPath = 'Teams';

        this.AllTeams = function() {
            return FireBaseData.AllRecords(DataPath);
        };

        this.AddTeam = function(TeamInfo) {
            return FireBaseData.AddRecord(DataPath, TeamInfo);
        };

        this.DeleteTeam = function(TeamKey) {
            FireBaseData.DeleteRecord(DataPath, TeamKey);
        };      

        this.GetOneTeam = function(TeamKey) {
            return FireBaseData.OneRecord(DataPath, TeamKey);
        };
    }
]);

As I have a Firebase Object, how can I get my named data objects from the $firebaseObject?

回答1:

This is a mess. Use $firebaseArray for collections, not $firebaseObject. Most of these strange wrapper factories are unnecessary. AngularFire services already have methods for add, remove, and so on, and all these factories attempt to make AngularFire into a CRUD model and don't actually provide any additional functionality or enhancements.

app.factory('Ref', function(FIREBASE_URL) {
   return new Firebase(FIREBASE_URL);
});

app.factory('Schedules', function($firebaseArray, Ref) {
   return $firebaseArray(Ref.child('Schedules'));
});

// or if you want to pass in the path to the data...
//app.factory('Schedules', function($firebaseArray, Ref) {
//   return function(pathToData) {
//      return $firebaseArray(Ref.child(pathToData));
//   };
//});

app.factory('Schedule', function($firebaseObject, Ref) {
  return function(scheduleId) {
     return $firebaseObject(Ref.child('Schedules').child(scheduleId));
  }
});

app.controller('...', function(Schedules, Schedule, Ref) {

  $scope.newSchedule(data) {
    Schedules.$add(data);
  };

  $scope.removeSchedule(key) {
    Schedules.$remove(key);
  };

  $scope.updateSchedule(key, newWidgetValue) {
     var rec = Schedules.$getRecord(key);
     rec.widgetValue = newWidgetValue;
     Schedules.$save(rec);
  };

  // get one schedule
  var sched = Schedule(key);
  sched.$loaded(function() {
     sched.widgetValue = 123;
     sched.$save();
  });


});

来源：https://stackoverflow.com/questions/30653704/unable-to-get-my-data-from-firebaseobject-using-angularfire-in-a-controller-vi