在 angularfire 1.0.0 中通过唯一的 firebase id 获取项目 [英] Fetching item by unique firebase id in angularfire 1.0.0

查看:21
本文介绍了在 angularfire 1.0.0 中通过唯一的 firebase id 获取项目的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我无法使用 angularfire 1.0.0 从我的 firebase 中获取一个独特的项目.澄清一下,我希望我的应用能够获取一个给定唯一 Firebase id 的帖子,例如-JkZwz-tyYoRLoRqlI_I".它在应用程序中导航时有效,例如单击指向特定帖子的链接,但不是刷新.我的猜测是它与同步有关.现在它可以在获取所有帖子并在 ng-repeat 中使用它时起作用.这是导航到页面时为什么它适用于一个项目的线索.这应该不难,因为这应该是一个非常标准的操作,但我无法让它工作.我到处搜索,但实际上没有这方面的指南.在 API 中,它们指的是 $getRecord(key)

<块引用>

从给定键的数组中返回记录.如果钥匙不在找到,返回空.此方法利用 $indexFor(key) 来查找适当的记录.

但这并没有按预期工作.还是我遗漏了什么?

它适用于这样的 ng-repeat:

<div><h1>{{postt.title}}</h1><div>{{postt.timestamp}}</div><div>{{postt.content}}</div>

但不适用于这样的独特项目:

<h1>{{post.title}}</h1><div>{{post.timestamp}}</div><div>{{post.content}}</div>

这是服务:

'use strict';angular.module('app.module.blog.post').factory("PostService", ["$firebaseArray", "FIREBASE_URL", function($firebaseArray, FIREBASE_URL) {var ref = new Firebase(FIREBASE_URL + "posts");var 帖子 = $firebaseArray(ref);返回 {all: posts,//ng-repeat 可以正常工作最后:函数(nr){var query = ref.orderByChild("timestamp").limitToLast(nr);返回 $firebaseArray(query);//ng-repeat 这个工作很好},创建:功能(后){返回posts.$add(post);},获取:函数(postId){控制台日志(postId);//这是-JkZwz-tyYoRLoRqlI_Ivar post = posts.$getRecord(postId);控制台日志(后);//这个打印空回帖;},删除:功能(发布){返回posts.$remove(post);}};}]);

正如get函数中的评论所说,postId在那里并且posts也被设置,但post为空.

这是控制器

'use strict';angular.module('app.module.blog.post', []).controller('PostCtrl', ['$scope', '$routeParams', 'PostService', function($scope, $routeParams, PostService) {//这将返回例如postId "-JkZwz-tyYoRLoRqlI_I"console.log($routeParams.postId);$scope.post = PostService.get($routeParams.postId);$scope.posts = PostService.all;//说明这个例子实际上不在这个控制器中,否则}]);

这是关于 firebase 数据库中内容的示例

帖子-JkUnVsGnCqbAxbMailo注释内容: ...时间戳:...标题: ...-JkZwz-tyYoRLoRqlI_I注释内容: ...时间戳:...标题: ...-JkhaEf9tQy06cOF03Ts内容: ...时间戳:...标题: ...

我觉得这个问题很奇怪,因为它应该是非常标准的.我显然错过了一些东西,但无法解决.非常感谢任何帮助!

提前致谢!

解决方案

我知道 $getRecord() 函数有点误导.你实际上从 $firebaseArray 得到的是一个 promise 一个数组.这意味着您的 posts 变量将在将来的某个时间包含您的帖子.话虽如此,似乎 $getRecord 函数仅在承诺已解决时才有效,即当数组已从 Firebase 下载时.为了确保在调用 $getRecord 函数时解决了承诺,您可以在承诺上使用 $loaded() :

var posts = $firebaseArray(ref);post.$loaded().then(function(x) {var post = x.$getRecord(postId);控制台日志(后);}).catch(函数(错误){console.log("错误:", 错误);});

如果你想知道为什么它适用于 ng-repeat,那是因为 Angular 知道 posts 变量是一个承诺,并在渲染之前等待它被解析价值.

I have trouble fetching one unique item from my firebase using angularfire 1.0.0. To clarify, I want my app to fetch a post given a unique firebase id e.g. "-JkZwz-tyYoRLoRqlI_I". It works when navigating in the app e.g. clicking on a link to a specific post, but not on a refresh. My guess is that it has something to do with synchronization. Right now it works when fetching all posts and use it in a ng-repeat. This is a clue to why it works for one item when navigating to the page. This should probably not be hard since this should be a pretty standard operation, but i can't get it to work. I have searched everywhere but there is actually no guide on this. In the API they refer to $getRecord(key)

Returns the record from the array for the given key. If the key is not found, returns null. This method utilizes $indexFor(key) to find the appropriate record.

But this is not working as expected. Or am i missing something?

It works for ng-repeat like this:

<div ng-repeat="postt in posts">
   <div>
      <h1>{{postt.title}}</h1>
      <div>{{postt.timestamp}}</div>
      <div>{{postt.content}}</div>
   </div>
</div>

But not for unique items like this:

<div>
   <h1>{{post.title}}</h1>
   <div>{{post.timestamp}}</div>
   <div>{{post.content}}</div>
</div>

This is the service:

'use strict';

angular.module('app.module.blog.post')

.factory("PostService", ["$firebaseArray", "FIREBASE_URL", function($firebaseArray, FIREBASE_URL) {

    var ref = new Firebase(FIREBASE_URL + "posts");
    var posts = $firebaseArray(ref);

    return {
        all: posts, // ng-repeat on this works fine

        last: function(nr) {
            var query = ref.orderByChild("timestamp").limitToLast(nr);
            return $firebaseArray(query); // ng-repeat on this work fine to
        },
        create: function (post) {
            return posts.$add(post);
        },
        get: function (postId) {
            console.log(postId); // This is -JkZwz-tyYoRLoRqlI_I
            var post = posts.$getRecord(postId);
            console.log(post); // This print null
            return post;
        },
        delete: function (post) {
            return posts.$remove(post);
        }
    };
}]);

As the comments say in the get function, the postId is there and posts is also set, but the post is null.

This is the controller

'use strict';

angular.module('app.module.blog.post', [])

.controller('PostCtrl', ['$scope', '$routeParams', 'PostService', function($scope, $routeParams, PostService) {

    // This returns e.g. postId "-JkZwz-tyYoRLoRqlI_I"
    console.log($routeParams.postId);

    $scope.post = PostService.get($routeParams.postId);    
    $scope.posts = PostService.all; // Illustrates the example not actually in this controller otherwise

}]);

This is what is an example on what is in the firebase database

<myfirebase>
 posts
 -JkUnVsGnCqbAxbMailo
 comments
 content: ...
 timestamp: ...
 title: ...
 -JkZwz-tyYoRLoRqlI_I
 comments
 content: ...
 timestamp: ...
 title: ...
 -JkhaEf9tQy06cOF03Ts
 content: ...
 timestamp: ...
 title: ...

I find this problem very wierd since it should be very standard. I am obviously missing something, but can't work it out. Any help is very much appreciated!

Thanks in advance!

解决方案

I know that the documentation of the $getRecord() function is kind of misleading. What you actually get from $firebaseArray is a promise of an array. It means that your posts variable will contain your posts at some point in the future. That being said, it seems that the $getRecord function only works when the promise have been resolved, i.e. when the array has been downloaded from Firebase. To make sure that the promise is resolved when you call the $getRecord function, you can use $loaded() on the promise :

var posts = $firebaseArray(ref);
posts.$loaded().then(function(x) {
    var post = x.$getRecord(postId);
    console.log(post);
}).catch(function(error) {
    console.log("Error:", error);
});

If you are wondering why it works for ng-repeat, it's because Angular knows that the posts variable is a promise and waits for it to be resolved before rendering the values.

这篇关于在 angularfire 1.0.0 中通过唯一的 firebase id 获取项目的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆