CODEWITHSUNDEEP
angularjsfirebaseangularfire
Felice
Felice

Reputation: 581

$firebaseArray is not a function?

I am creating a firebase blog app. I am experiencing a problem in a controller of mine where TypeError: $firebaseArray is not a function I have been using $firebaseArray throughout the entire span of the app. I don't know how I broke it. I can show you the code to my controller.

enter image description here

 app.controller('postController',["$scope", "$location","$routeParams","Blog","FBURL","Auth","authDataSrvc", "$firebaseObject", "$firebaseArray","FilePicker", "$window", function($scope,$location,$routeParams,Blog,FBURL,$firebaseArray,$firebaseObject,FilePicker,$window,Auth,authDataSrvc){


$scope.posts = Blog.allPosts; //All blog posts
var postId = $routeParams.postId;

if(postId){
  $scope.selectedPost = getPost(postId); // gets unique object based on its id with get post function
}

function getPost(postId){
  var ref = new Firebase(FBURL + "/" + postId);
  return $firebaseArray(ref);
}


$scope.addPost = function(newpost){
  Blog.addPost($scope.newpost);
  $location.path('/'); //redirects to home page
  console.log(newpost);
  console.log($scope.posts); // all posts
  $scope.newpost ={}; //reset the message


};

$scope.currentPost = function(postId){
  Blog.getPost(postId);
  console.log(postId);
};

$scope.editPost = function(post){
  $scope.selectedPost.$save(post);
  $location.path('/');
};

$scope.files = [];


$scope.pickFile = function(){
    FilePicker.pickMultiple(
        {
          mimetype: 'image/*',
          maxFiles: 4
        },
        $scope.onSuccess
    );
};

$scope.onSuccess = function(Blobs,newpost){
  $scope.files.push(Blobs); //push to filepicker

  var imageURLs = []; //new image urls array
  Blobs.forEach(function(file){
    imageURLs.push(file.url); //inserts Blob.urls to imageURLs array
  });
  $scope.newpost['photo'] = imageURLs; //adds photo urls array to newpost.photo which stores to firebase 'newpost object'
  console.log(Blobs.url);
  $window.localStorage.setItem('files', JSON.stringify(Blobs.url));
};

// COMMENTS SECTION

  /*  {

  }*/

$scope.createComment = function(post, message){

  var profilePic;
  var profileName;
  /* Check to see social media provider before pushing that information */
  if($scope.authData.provider === 'facebook'){
    profilePic = $scope.authData.facebook.profileImageURL;
    profileName = $scope.authData.facebook.displayName;
  }
  else if($scope.authData.provider === 'google'){
    profilePic = $scope.authData.google.profileImageURL;
    profileName = $scope.authData.google.displayName;
  }
  //console.log(profilePic,profileName);

  var ref = new Firebase(FBURL + "/" + postId + "/comments/");
  var fireCommentArray = $firebaseArray(ref);
  return fireCommentArray.$set(
    {
      text: $scope.message.text,
      pic: $scope.profilePic,
      name: $scope.profileName
    }
  ),
  $scope.message = '';
};



$scope.removeComment = function(post, message) {
  var commentForDeletion = new Firebase(FBURL + "/" + postId + "/comments/" + message.$id);
  commentForDeletion.$remove();
};

Right now it errors out on getPost function, $scope.addCommentFunction which are both using $firebaseArray.$add() calls.

My app does have separated services and directives as well but everything seems to be intact with no errors.

Upvotes: 0

Views: 1483

Answers (1)

orange
orange

Reputation: 8090

Your $firebaseArray object gets injected as 9th parameter, but the variable $firebaseArray is the 6th parameter.

Try this instead:

app.controller('postController', [
  "$scope", "$location", "$routeParams", "Blog", "FBURL", 
  "Auth", "authDataSrvc", "$firebaseObject", "$firebaseArray", "FilePicker", 
  "$window", 
  function(
    $scope, $location, $routeParams, Blog, FBURL, 
    Auth, authDataSrvc, $firebaseObject, $firebaseArray, FilePicker, 
    $window
){

... or remove the ["$scope", "$location", "$routeParams", "Blog"... altogether if you don't mangle your variable names through a compressor or obfuscator.

Upvotes: 5

Related Questions