The $firebaseObject variable is not defined

My AngularJs + AngularFire setup includes email/password authentication and a node called "users" to list authenticated users. Here is a snapshot: https://i.sstatic.net/eBz3G.png

Within my authentication service, I have an AngularJs factory:

.factory('Auth', function($firebaseAuth, $firebaseObject, $firebaseArray){

 var ref = firebase.database().ref();
 var auth = $firebaseAuth();
 var users = $firebaseArray(ref.child('users'));
 var firebaseUser = auth.$getAuth();

var Auth = {

getStudent: function(studentId){
  console.log(studentId)
  return $firebaseObject(ref.child('users').child(studentId));
},

studentSignupProfile: function(profile){
    console.log('Student profile service..!');
    var obj = Auth.getStudent(firebaseUser.uid);
    console.log(obj.name);

    return obj.$loaded().then(function(){
      obj.phone = profile.phone;
      obj.address = profile.address;
      return obj.$save();
    });
}

};

return Auth;
});

This is the controller code:

 $scope.studentSignupProfile = function(profile){
    console.log(profile);
    if (profile == undefined) {
        toaster.pop('info','Tell us more about yourself!');
    } else {
        Auth.studentSignupProfile(profile).then(function(msg){
            toaster.pop('info','Profile updated!');
            $state.go('home');
        });
    }
}

The issue arises in console.log(obj.name) returning undefined despite the existing user UID as shown in the image above.

When I use the getStudent function with a specific uid like 4BAIdOXZv6NTEKsjgI15JTajFtz2, it logs the correct uid but retrieving the $firebaseObject results in undefined.

Answer №1

Make sure to wait for the object to load before writing to the console. Place the console.log() inside the $loaded handler:

var student = Auth.getStudent(firebaseUser.uid);

return student.$loaded().then(function(){
   // The object is now loaded
   console.log(student.name);

  student.phone = profile.phone;
  student.address = profile.address;
  return student.$save();
});

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Why is the location search not staying centered after resizing the map on Google Maps?

I am currently working on integrating Angular with Google Maps. I need to add some markers along with location search functionality. Additionally, I am including location information in a form. When the addMarker button is clicked, a form opens and the map ...

Tips for effectively highlighting search text within HTML content without causing any issues

I am in search of a solution that can assist me in searching for specific terms within an HTML string while also highlighting them. I have the ability to remove the HTML content from the string, but this poses the problem of losing the context of the origi ...

Using a background image in a React component

Currently, I am working on a webpage and facing an issue while trying to set a background image for a Material UI element using the background-image CSS property. Despite researching online for solutions, I am unable to make the image appear. P.S.1: I eve ...

Nunjucks not loading the script when moving from one page to another

Currently, I am in the process of developing a website utilizing nunjucks and express. This website serves as a blog platform with content sourced from prismic. My goal is to load a script file for an active campaign form whenever a user navigates from a b ...

Having trouble loading a CSV file into a static folder using Node.js and Express

As a newcomer to node and express, I am exploring the integration of d3 visualizations into my web page. Essentially, I have a JavaScript file that creates all the d3 elements, which I then include in my .ejs file. I am currently attempting to replicate a ...

Restricting zooming to only occur within the img element in a UI

Is there a method to enable image zoom inside specific divs without affecting the overall page zoom? At the moment, I have: <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale ...

The issue of memory leakage in Three.js

I have come across an unusual memory leak in three.js (r73). Here are the steps to reproduce it: 1) Go to the following link using Google Chrome (version 46.0.2490.80 m) 2) Open DevTools -> Profiles -> Take Heap Snapshot. Check out my screenshot be ...

Each time the website refreshes, Object.entries() rearranges the orders

After reading the discussion on Does JavaScript guarantee object property order? It seems that Object.entries() should maintain order. However, I encountered an issue with my Angular website where the order of keys in Object.entries() changed upon refres ...

Enhancing the theme using material-ui@next and typescript

While developing my theme using material-ui, I decided to introduce two new palette options that would offer a wider range of light and dark shades. To achieve this, I extended the Theme type with the necessary modifications: import {Theme} from "material ...

Retrieve JSON data within React without the need for importing it

Recently, I've been incorporating data from a JSON file into a React component in a unique way: import data from '../../public/json/data.json'; Using the innovative create-react-app tool, upon running npm run build, the expected behavior o ...

Unleashing a zip file for direct download via cloud functions

I am facing an issue with a firebase cloud function that uses express to stream a zip file of images to the client. The strange part is that everything works perfectly fine when testing locally, but when I upload it to firebase, I encounter the following e ...

What is the best way to display a template after submitting data via AJAX in the Flask framework?

Encountering an issue where I am unable to open render_template after posting data with ajax. Below is my ajax code: if ($(this).attr("value") == "button-three") { var skoring = getRadioVal(document.getElementById('mentodeNegasi'),'neg ...

Generate a Selectpicker dynamically when a button is clicked

Wanting to insert a new row in an HTML table dynamically by clicking on an add button. The new row includes a select element with the selectpicker class. Interestingly, when I remove the selectpicker class in my script to append a new row, the select eleme ...

What steps should be taken to safeguard an Angular 1.2 application from XSS vulnerabilities?

Recently, I stumbled upon an interesting article at this link: In my work on an enterprise application, we have been using Angular 1.2 but are now looking to upgrade to newer versions like 1.3 and beyond. I am curious to hear from others who have made sp ...

Arranging information in an AngularJS table based on column headers

I have been developing a web application using AngularJS. The application sends an HTTP request to a database server to retrieve information about claims, which is then displayed in a table. Each page of the table shows 100 claims, with a total of approxim ...

Prevent the selection of a dropdown option in AngularJS once it has already

var demoApp = angular.module('myApp', []); demoApp.controller('QaController', function($scope, $http) { $scope.loopData = [{}, {}]; $scope.questions = { model: null, availableOptions: [ {id: '1& ...

Unload pre-loaded JavaScript documents

Two javascript files are included in a popup (simple div) created using ajax. <script type="text/javascript" src="<?php echo JS ?>pm.js"></script> <script type="text/javascript" src="<?php echo JS ?>chat.js"></script> ...

Built-in functionality in aws-amplify for seamless redirection to Microsoft sign-in page within a ReactJS application

Important Note: I prefer not to use the built-in hostedUI page of AWS Cognito service. I have a customized login page where I have already integrated Google and Facebook login options by adding two additional buttons labeled Google Login and Facebook Logi ...

Using an array of references in React

I've encountered a problem where I'm trying to create a ref array from one component and then pass it to another inner component. However, simply passing them as props to the inner component doesn't work as it returns null. I attempted to fo ...

Simulating npm package with varied outputs

In my testing process, I am attempting to simulate the behavior of an npm package. Specifically, I want to create a scenario where the package returns a Promise that resolves to true in one test and rejects with an error in another. To achieve this, I hav ...