Angularfire on thinkster

Question

everyone!

Excuse me for my bad English, please, ask me and I'll try to explain more.

I'm learning angular with a sample work on http://thinkster.io and I'd noticed in lesson 4 that it uses old version of angularfire (I guess that less than 2), and syntax of latter was changed. I've tried to make changes in my code for v2 (for example I added $asArray() element to return of $firebase, and $add and $remove started working. But my method 'find' did not, and $keyAt returns null. Where is my false?

post.js:

'use strict';

app.factory('Post', 
    function ($firebase, FIREBASE_URL) {
        var ref = new Firebase('https://torid-fire-6813.firebaseio.com/posts');

        var posts = $firebase(ref).$asArray();

        var Post = {
            all: posts,
            create: function (post) {
                return posts.$add(post);
            },
            find: function (postId) {
                return posts.$keyAt(postId);
            },
            delete: function (postId) {
                return posts.$remove(postId);
            }
        };

        return Post;
    }
);

and postview.js, where method 'find' used:

'use strict';

app.controller('PostViewCtrl', function($scope, $routeParams, Post){
    $scope.post = Post.find($routeParams.postId);
});

Answer 1

I have the same issue.

and Indeed using $getRecord in post.js:

find: function (postId) {
    return posts.$getRecord(postId);

and using {{ post.$id }} in posts.html

<a href="#/posts/{{ post.$id }}">comments</a>

makes it work just fine. Though, I am quite a noob and don't really understand why THIS actually works. Maybe someone can provide some info? Also, I cannot find the $getRecord documentation. Shouldn't it be able to work with $keyAt?

Answer 2

I have run into the same problem doing http://thinkster.io tutorial. I'm using the latest angularfire 0.8.0 and AngularJS v1.2.16. (installed by Yeoman)

$child is gone in angularfire 0.8.0 https://www.firebase.com/blog/2014-07-30-introducing-angularfire-08.html

In your find method you should use $getRecord();

    find: function(postId){
        return posts.$getRecord( postId );
    },

Also, in views/posts.html I'm passing post.&id, instead of postId. (Not sure it's the right approach though but it works)

<a href="#/posts/{{ post.$id }}">comments</a>

It seems that postId is behaving similar to $index. If you console.log(postId) or {{postId}} in your view, you will notice this.

Running into these issues makes me wondering if the factory is even necessary with this new API. It seems that it could be done in the controllers.

I've asked thinkster people to update their tutorial. I'm hoping they will do it pretty soon.