For those looking to fetch and log data within their code, it is advisable to avoid using AngularFire and instead stick with the JavaScript SDK:
$scope.login = function(users) {
firebase.auth().signInWithEmailAndPassword(users.email, users.password)
.then(function(result) {
var ref = firebase.database().ref("/profiles");
var examination = ref.orderByChild('uid').equalTo(result.uid);
examination.on('value', function(snapshot) {
console.log(snapshot.val());
});
In this code snippet, on('value' has been included, signaling the Firebase SDK to initiate data retrieval from the database. Further details on this topic can be found in the Firebase documentation for web developers, which is highly recommended for a comprehensive understanding. Investing some time there will undoubtedly raise more questions than anticipated.
If one opts to continue using AngularFire, it's important to refrain from relying on console.log for monitoring loading progress. According to the AngularFire quickstart guide:
... $scope.data will eventually populate with data fetched from the server. Given the asynchronous nature of this process, a delay occurs before the data becomes accessible within the controller. While tempting to utilize a console.log statement immediately afterward, the data may not have been fully downloaded yet, making the object seem empty.
Alternatively, displaying the data directly within the HTML template simplifies the task:
To effectively log the data, you can simply output it within the view utilizing Angular's json filter. AngularFire notifies the Angular compiler once data loading is complete, eliminating concerns regarding its availability timeline.
<pre>{{ data | json }}</pre>
This advice stems from the section on managing asynchronous operations in the AngularFire guide.