TypeError:undefined在提交&时不是函数。使用AngularFire和AngularJS删除帖子(ThinksterIO教程第7章)

时间:2014-09-05 19:37:20

标签: angularjs firebase angularfire

我使用Thinkster.io AngularJS教程遇到了多个TypeErrors:学习构建现代Web应用程序Chapter 7. Creating your own user data using firebase,因为在AngularFire升级到v0.8.0之后,教程现已过时。具体而言,已取出.$child().$on()方法。这是更改日志

https://github.com/firebase/angularfire/releases/tag/v0.8.0

在注册新用户getting help solving my initial TypeError issues之后,当我提交帖子和尝试删除帖子时,我开始看到2个新的TypeErrors出现。罪魁祸首再次是过时的.$child().$on()方法。

提交帖子> TypeError:undefined不是函数

提交帖子后,我在控制台中看到以下TypeError出现

enter image description here

此TypeError指向post.js服务

TypeError: undefined is not a function
    at http://localhost:9000/scripts/services/post.js:16:11

$child方法调用开头的第16行第11行。另外,请注意第一个.&child()之后的第二个return posts.$add(post).then(function(ref) { var postId = ref.name(); user.$child('posts').$child(postId).$set(postId); return postId; }); 。这将导致另一个TypeError。

.$on()

我会提到即使我收到这个TypeError,我仍然能够成功创建一个帖子,我在Forge和应用程序的帖子列表中看到它。

删除帖子> TypeError:undefined不是函数

当我尝试删除刚刚创建的帖子时,我得到另一个与现已弃用的TypeError: undefined is not a function at Object.Post [as delete] (http://localhost:9000/scripts/services/post.js:27:10) at Scope.$scope.deletePost (http://localhost:9000/scripts/controllers/posts.js:10:14) 方法相关的TypeError。

enter image description here

.$on()

指向 post.js 服务中此代码中的delete: function(postId) { if(User.signedIn()) { var post = Post.find(postId); post.$on('loaded', function(){ var user = User.findByUsername(post.owner); posts.$remove(postId).then(function(){ user.$child('posts').$remove(postId); }); }); } }

post.$loaded(function(result) {Chapter 7. Creating your own user data using firebase
  // something related to finding user of post
  // remove post from posts collection 
  // but of course we can't use .$child()
});

我意识到我必须做一些像

这样的事情
'use strict';

app.factory('Post', function($firebase, FIREBASE_URL, User){
  var ref = new Firebase(FIREBASE_URL + 'posts');
  var posts = $firebase(ref).$asArray();

  var Post = {
    all: posts,
    create: function(post) {
      if(User.signedIn()) {
        var user = User.getCurrent();
        post.owner = user.username;

        return posts.$add(post).then(function(ref) {
          var postId = ref.name();
          user.$child('posts').$child(postId).$set(postId);
          return postId;
        });
      }
    },
    find: function(postId) {
            return $firebase(ref.child(postId)).$asObject();
    },
    delete: function(postId) {
      if(User.signedIn()) {
        var post = Post.find(postId);
        post.$on('loaded', function(){
          var user = User.findByUsername(post.owner);
          posts.$remove(postId).then(function(){
            user.$child('posts').$remove(postId);
          });
        });
      }
    }
  };

  return Post;

});

但问题是,当像我这样的JS初学者面对AngularFire更改日志和API时,我只是迷路而且不堪重负到关闭点。任何指导都会一如既往地受到高度赞赏。


文件


post.js 服务

'use strict';

app.controller('PostsCtrl', function($scope, $location, Post) {

  $scope.posts = Post.all;

  $scope.post = {url: 'http://', title: ''};

  $scope.deletePost = function(post) {
    Post.delete(post);
  };

});

post.js 控制器

{{1}}

1 个答案:

答案 0 :(得分:1)

我厌倦了,所以我采取了一种简单的方法(只是为了通过教程)。我创建了userRef(这应该来自User对象imo):

modulename.factory("Post", function ($firebase, FIREBASE_URL, User) {
    //rest code

    var userRef = new Firebase(FIREBASE_URL + "users");

    var Post = {
        create: function(){
            //rest of the code

            return posts.$add(post).then(function (ref) {
                var postId = ref.name();

                userRef.child(user.$id).child("posts").child(postId).set(postId);

                return postId;
            });
        }
    }
});

这只是一种方法,当我在寻找一个好的解决方案时,我看到了更多的示例代码。我希望它有所帮助。