My current challenge is figuring out how to properly format firebase data to work seamlessly with Angular. I have a functional view that works with ng as a static display, and within the $scope it is defined like this:
$scope.standardItems = [{
name: "The Name",
sizeX: 2,
sizeY: 1,
row: 0,
col: 0
}, {......etc
However, when attempting to supply data from firebase, it doesn't seem to work correctly, presumably because the output isn't formatted in the right way. The connection seems fine and data can be added, but firebase automatically inserts its own ID into the data. Here's an example of how the data looks when exported from the firebase console:
{
"-KdJVcYUXMfeym3jPy04" : {
"att" : "grid",
"col" : 0,
"id" : 1487476528646,
"name" : "This is a test grid",
"row" : 0,
"sizeX" : 2,
"sizeY" : 1
},
The additional parameters aren't crucial, but the structure is probably important. When I log the output of the firebase array using:
var todosRef = new Firebase('https://xxxxxxxxxx.firebaseio.com/');
$scope.todos = $firebaseArray(todosRef);
console.log($scope.todos);
I see the following in the Chrome debug console:
Array[0]
0:Object
$id: "-KjhbuvgtVvFUnbfbmj04"
$priority:null
att:"grid"
col:0
id:1487476528646
name:"This is a test grid"
row:0
sizeX:2
sizeY:1
__proto__
Essentially, my question boils down to how can I ensure that Angular receives exactly what is being passed in the static example above from the controller? How can I accurately replicate what is being passed to Angular from the array - considering the discrepancies between the export from firebase console and the Chrome log console. It's challenging especially because all parent nodes have unique non-sequential IDs like -KdJVcYUXMfeym3jPy04, making it unclear how to extract or utilize them. Do I need a wildcard in the path? If so, what would it look like? The code functions perfectly with a static local array, so the issue lies in reading JSON from firebase.