问题描述
限时送ChatGPT账号..我在数组上使用 AngularFire 和 promise($loaded()
on firebaseArray()
).
I am using AngularFire and promises on arrays ($loaded()
on firebaseArray()
).
目前,我使用以下代码:
Currently, I'm using the following code:
问题:我转到第 1 页,数据已加载且一切正常.转到第 2 页并返回到第 1 页.现在 $loaded()
在我刷新整个页面之前不起作用.我该如何解决这个问题?
Problem: I go to page1, the data is loaded and all fine. Go to page 2 and come back to page1. Now the $loaded()
doesn't work until I do a full page refresh. How do I fix this problem?
app.factory('Items', ['FBURL', '$firebaseArray', function(FBURL, $firebaseArray) {
return {
ofCategory: function(catId){
var ref = new Firebase(FBURL);
var refSearch = new Firebase.util.NormalizedCollection(...).select(...).ref();
var allItems= refSearch.orderByChild(...);
return $firebaseArray(allItems);
}
};
}]);
第 1 页:
function readData() {
if($scope.Items) {
$scope.Items.$destroy();
$scope.Items= null;
}
$scope.Items = Items.ofCategory($routeParams.id);
$scope.Items.$loaded().then(function(itm) {
...
});
}
第 2 页:
$scope.Items= Items.ofCategory($routeParams.id);
Firebase 文档1 说:$loaded()
返回一个承诺,该承诺在从我们的数据库下载初始记录后解析.这只是调用一次,应该小心使用",这可能是我在这里得到的.
The Firebase documentation1 says: "$loaded()
returns a promise which resolves after the initial records have been downloaded from our database. This is only called once and should be used with care", and that is probably what I get here.
我的尝试:如图所示,在 Page1 上的 readData()
函数中,我销毁了 $scope.Items
变量在任何新负载之前.但它似乎没有做任何事情.AFAIU,$loaded()
正在处理 firebaseArray()
,因此销毁 $scope
数组可能没有多大帮助.那么,在不需要完全刷新页面的情况下,我还应该做些什么来完成这项工作?
What I've tried: As shown, in my readData()
function on Page1, I destroy the $scope.Items
variable before any new load. But it doesn't seem to be doing anything. AFAIU, $loaded()
is working on firebaseArray()
, so destroying the $scope
array might not help much. So, what else should I do to make this work without needing to fully refresh the page?
推荐答案
我听说应该避免使用 AngularFire,这看起来是一个很好的理由.
I have heard that AngularFire should be avoided and this looks like a good reason.
直接使用 firebase API:
Use the firebase API directly:
app.factory('FbItems', ['FBURL', '$q', function(FBURL, $q) {
return {
ofCategory: function(catId){
var ref = new Firebase(FBURL);
var refSearch = new Firebase.util.NormalizedCollection(...).select(...).ref();
var allItems= refSearch.orderByChild(...);
var promise = allItems.once('value').then(function(snapshot) {
return snapshot.val();
});
return $q.when(promise);
}
};
}]);
使用 $q.when
.只有在 AngularJS 执行上下文中应用的操作才会受益于 AngularJS 数据绑定、异常处理、属性监视等.
It is important to convert the ES6 promise to an AngularJS $q promise with $q.when
. Only operations which are applied in the AngularJS execution context will benefit from AngularJS data-binding, exception handling, property watching, etc.
用法:
function readData() {
promise = FbItems.ofCategory($routeParams.id);
promise.then(function(items) {
$scope.Items = items;
}).catch(function(error) {
console.log(error);
});
}
这篇关于AngularFire V1.2 $firebaseArray() $loaded() 只调用一次的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
更多推荐
[db:关键词]
发布评论