这是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的结果只是空的。我做错了什么?非常感谢任何见解。
答案 0 :(得分:0)
数据以异步方式加载。这是JavaScript 101,在尝试处理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处理剩下的事情。