这是html:
<div ng-controller="FilterController as ctrl">
<div>
All entries:
<span ng-repeat="entry in ctrl.array">{{entry.from}} </span>
</div>
<div>
Entries that contain an "a":
<span ng-repeat="entry in ctrl.filteredArray">{{entry.from}} </span>
</div>
</div>
这是我的脚本:
angular.module('myApp', ["firebase"]).
controller('FilterController', ['filterFilter', '$firebase', function(filterFilter, $firebase) {
var ref = new Firebase("https://******.firebaseio.com/");
this.array = $firebase(ref).$asArray();
this.filteredArray = filterFilter(this.array, 'a');
}]);
filteredArray的结果为空。我做错了什么?非常感谢您的真知灼见。
数据以异步方式加载。这是JavaScript101,在尝试处理Angular和Firebase之前,您可能应该在异步操作上花一点时间。
过滤器调用可能在请求发送到服务器之前就发生了,因此数组仍然是空的。
您可以使用$loaded方法来等待下载初始数据。但是,您的过滤结果仍然是静态的,从而规避了实时功能。
this.array.$loaded(function() {
console.log(this.array.length); // current length at time of loading
});
console.log(this.array.length); // 0, hasn't loaded yet
一般来说,你不应该在代码级别做这样的事情,而是让Angular和Firebase发挥它们的魔力;将其移动到视图中:
<li ng-repeat="item in array | filter:searchText" />
如果您发现自己试图操纵控制器中的数组来转换数据,请改为查看$extendFactory。但大多数情况下,只需将其单独放置并绑定到范围,然后让Angular处理其余部分