Question

这是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的结果只是空的。我做错了什么？非常感谢任何见解。

Answer 1

数据以异步方式加载。这是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处理剩下的事情。

无法以角度过滤从firebase返回的数组

1 个答案: