CODEWITHSUNDEEP
firebaseangularfirefirebase-realtime-database
martisan
martisan

Reputation: 221

Angularfire Uncaught ReferenceError: Firebase is not defined

I'm following the example Getting started with Firebase and Angular - Firecasts #4 and I keep getting:

Uncaught ReferenceError: Firebase is not defined.

Any ideas?

Here is my app.js:

    angular
    .module('app', ['ngRoute', 'firebase'])
    .constant('FirebaseUrl', 'https://<my-app>.firebaseio.com/')
    .service('rootRef', ['FirebaseUrl', Firebase])
    .service('users', Users)
    .controller('MyCtrl', MyController)
    .config(ApplicationConfig);

function ApplicationConfig($routeProvider) {
    $routeProvider.when('/', {
        controller: 'MyCtrl as ctrl',
        templateUrl: 'views/myctrl.html'
    });
}

function Users(rootRef, $firebaseObject, $firebaseArray) {
    var usersRef = rootRef.child('users');
    this.get = function get(id) {
        return $firebaseObject(usersRef.child(id));
    };

    this.all = function all() {
        return $firebaseArray(usersRef);
    };
}

function MyController(users) {
    this.users = users.all();
}

This is my index.html:

<!DOCTYPE html>
    <html lang="en" ng-app="app">
     <head>
    <meta charset="UTF-8">
    <title>AngularFire</title>
    <script src="bower_components/angular/angular.js"></script>
    <script src="bower_components/firebase/firebase.js"></script>
    <script src="bower_components/angular-route/angular-route.js"></script>
    <script src="bower_components/angularfire/dist/angularfire.js"></script>
    <script src="app.js"></script>
</head>
<body>
    <ng-view></ng-view>
</body>
</html>

Upvotes: 2

Views: 4645

Answers (3)

Francesco
Francesco

Reputation: 10830

I add this as answer to use the link: new docs

As Boas Babs said, the new version uses a different approach to get the database reference. 

app.controller("SampleCtrl", function($scope, $firebaseObject) {
  var ref = firebase.database().ref();

  // download the data into a local object
  $scope.data = $firebaseObject(ref);
});

Upvotes: 0

Adeyemi Simeon
Adeyemi Simeon

Reputation: 170

It seems like you are using new version of firebase. Go ahead and rewrite this example like it is said here: https://firebase.google.com/support/guides/firebase-web#monitor_authentication_state_numbered.

You need point 4: "In the new SDKs, you no longer instantiate a database references via new Firebase. Instead, you will initialize the SDK via firebase.initializeApp()..."

Upvotes: 1

theblindprophet
theblindprophet

Reputation: 7937

You need to insert:

var rootRef = new Firebase('https://<my-app>.firebase.io.com');

inside of MyController as seen in this picture.

The commentator explains that Firebase is injected into to the controller as a "Firebase constructor function."

'FirebaseUrl' is the url defined above inside .constant.

His explaination is quite fast, but either way you need that line of code to help define the reference.

Please edit or comment on this post if anyone has more insight.

Upvotes: 0

Related Questions