2016-02-10 161 views
0

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

Click here to access plunker

的index.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> 

的script.js(使用火力)

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(); 
    }); 

}); 

回答

1

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

如果你把它改为:

$scope.customers=[]; 

并转换是火力地堡被返回Array的复杂的哈希表,它的工作原理(为了说明的缘故,我会首先检查火力地堡有方法返回一个数组而不是使用这个特殊的解释代码):

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

    $scope.customers.push(item); 
} 
}); 
+0

谢谢Daniel Lesser,这个工作很完美。我将检查firebase是否有返回数组的方法。 –