title: "undefined is not a function" error using angularFire
body: <p>i am trying to display data from firebase and i have below code. I already declared firebase dependency for my app.</p>
  
  <pre><code>.controller('AdvMainCtrl', ['$scope', 'dataLoad', 
  
      function($scope, dataLoad, $route, $routeParams, $location, $resource, angularFire) {
          var categoryPromise = dataLoad.loadCategories($scope, 'categories'),
          tmPromise = dataLoad.loadTransportationMode($scope, 'tModes'),
          tourPromise = dataLoad.loadAdventures($scope, 'tours');
          categoryPromise.then(function() {
              console.log('data loaded');
          });
  
          $scope.$watch('category', function() {
              if (typeof $scope.category === 'undefined') return;
              console.log('category changed');
              console.log($scope.category.name);
          });
          $scope.$watch('tMode', function() {
              if (typeof $scope.tMode === 'undefined') return;
              console.log('tm changed');
              //console.log($scope.transportationMode.name);
          });
      var ref = new Firebase("https://wpladv.firebaseio.com/adventure");
      $scope.tours = [];
      angularFire(ref, $scope, "tours");
      }
  ])
  </code></pre>
  
  <p>in the console i see the error occurring at <code>angularFire(ref, $scope, "tours");</code> statement. I am not sure how to fix this.</p>
  
  <p>the entire code in my controller is </p>
  
  <pre><code>.controller('AdvMainCtrl', ['$scope', 'dataLoad',
          function($scope, dataLoad, $route, $routeParams, $location, $resource, angularFire) {
              var categoryPromise = dataLoad.loadCategories($scope, 'categories'),
              tmPromise = dataLoad.loadTransportationMode($scope, 'tModes'),
              tourPromise = dataLoad.loadAdventures($scope, 'tours');
              categoryPromise.then(function() {
                  console.log('data loaded');
              });
  
              $scope.$watch('category', function() {
                  if (typeof $scope.category === 'undefined') return;
                  console.log('category changed');
                  console.log($scope.category.name);
              });
              $scope.$watch('tMode', function() {
                  if (typeof $scope.tMode === 'undefined') return;
                  console.log('tm changed');
                  //console.log($scope.transportationMode.name);
              });
          var ref = new Firebase("https://wpladv.firebaseio.com/adventure");
          $scope.tours = [];
          angularFire(ref, $scope, "tours");
          }
      ])
  </code></pre>
  
  <p>the error is showing at "var categoryPromise = dataLoad.loadCategories($scope, 'categories')," statement</p>
  
  <p>i have the following code in my api js file.</p>
  
  <pre><code>angular.module('localAdventuresApp')
      .factory('dataLoad', ['angularFire',
          function(angularFire) {
              var dbUrl = 'https://wpladv.firebaseio.com/';
  
              return {
                  loadCategories: function(scope, items) {
                      var cat = '/category';
                      return angularFire(dbUrl + cat, scope, items, []);
                  },
                  loadTransportationMode: function(scope, items) {
                      var cat = '/transportMode';
                      return angularFire(dbUrl + cat, scope, items, []);
                  },
                  loadAdventures: function(scope, items) {
                      var cat = '/adventures';
                      return angularFire(dbUrl + cat, scope, items, {});
                  }
              }
          }
      ])
  </code></pre>
  
  <p>the error is being displayed in the "return angularFire(dbUrl + cat, scope, items, []);" statement here. The error which i am seeing in my console is "Error: Please provide a Firebase reference instead of a URL, eg: new Firebase(url)".</p>