Angular JS 搜索过滤器不会使用 Firebase 过滤数据

Angular JS search filter is not filtering the data by using Firebase

本文关键字:Firebase 过滤 数据 JS 搜索 过滤器 Angular      更新时间:2023-09-26

我遇到的问题是搜索过滤器不过滤表。对问题可能是什么有什么建议或帮助吗?我正在制作的应用程序很简单,用户应输入两个文本字符串并将其保存,以便数据存储在Firebase数据库中。然后通过搜索过滤能力。但是,搜索不起作用。

单击此处访问 plunker

索引.html

 <table class="table table-bordered">
  <thead>
    <th>Plate Number</th>
    <th>Car Brand</th>
  </thead>
  <tbody>
    <tr ng-repeat="customer in customers | filter:search">
      <td>{{customer.CustomerPlateNumber}}</td>
      <td>{{customer.CustomerCarBrand}}</td>
    </tr>
  </tbody>
</table>

脚本.js(使用 Firebase)

angular.module('myApp', []);
angular.module('myApp').controller('customerCtrl', function($scope) {
  $scope.CustomerPlateNumber = "";
  $scope.CustomerCarBrand = "";
  $scope.customers = {};
  $scope.myData = new Firebase("https://sizzling-torch-2102.firebaseio.com/CustomerInformation");
  // PS, husk at CustomerPlatenumber: må være lik navnet på ng-model. 
  $scope.saveCustomerData = function() {
    $scope.myData.push({CustomerPlateNumber: $scope.CustomerPlateNumber, CustomerCarBrand: $scope.CustomerCarBrand});
  // Empty input after storing data
  $scope.CustomerPlateNumber = "";
  $scope.CustomerCarBrand = "";
  };
  // Two parameters, needs to know what its going to be fired upon, and a function that tells what to do when it is fired. 
  $scope.myData.on('value', function(snapshot) {
    $scope.customers = snapshot.val();
    //not recommended, look at "refresh bindings angular"
    $scope.$apply(); 
  });
});

问题是 $scope.customers 不是一个数组 [],而是一个复杂的 JavaScript 对象 {}。

如果将其更改为:

$scope.customers=[];
并将Firebase

返回的复杂哈希表转换为数组,它可以工作(为了解释,我首先检查Firebase是否有返回数组的方法,而不是使用此特定的解释性代码):

$scope.myData.on('value', function(snapshot) {
var values = snapshot.val();
for(var myVal in values)
{
  var item = values[myVal];
  $scope.customers.push(item);
}
});