Sadeep Sadeep - 2 months ago 29
AngularJS Question

Error: Can't find variable: Firebase (angularjs and angular fire)

I'm new to firebase and angularfire. In my app, I'm trying to create a new item (a teacher object) in a firebase database. I keep getting

Error: Can't find variable: Firebase
.

I have included following script tags in
index.html
:

<script type="text/javascript" src="../libs/firebase/firebase.js"></script>
<script type="text/javascript" src="../libs/angular/angularfire/angularfire.js"></script>


Then, in my
app.js
I have included
firebase
like:

angular.module('app', ['firebase']);


My controller is:

app.controller('teacherCreateCtrl', ['$scope', '$state', 'Teacher', '$firebase', function($scope, $state, Teacher, $firebase) {
var ref = new Firebase("https://xxx-xxxxxx.firebaseio.com/app/teachers");
var firebaseConnection = $firebase(ref);
$scope.teacher = new Teacher();
$scope.userClickedCancel = function() {
$state.go('app.teacher');
}
$scope.userClickedSave = function(newTeacher) {
firebaseConnection.$set(newTeacher);
}
}]);


Code execution stops at
var ref = ...
in the controller. Appreciate any help. Thanks.

I'm using firebase 3.4.0v and angularfire 2.0.2v. Note that, my template that used this controller is embedded in
index.html
as a view.

Answer

You are mixing up your versions. If you are using v3.x firebase you can't use v2.x code. So instead of:

var ref = new Firebase("https://xxx-xxxxxx.firebaseio.com/app/teachers");

You have to do it like this:

var config = {
  apiKey: "<API_KEY>",
  authDomain: "<PROJECT_ID>.firebaseapp.com",
  databaseURL: "https://<DATABASE_NAME>.firebaseio.com",
  storageBucket: "<BUCKET>.appspot.com",
};
firebase.initializeApp(config);

Check out the docs for more info.

Comments