重置angularjs中的过滤数据

时间:2014-03-28 13:09:58

标签: javascript angularjs

我想重置已过滤的库存数组,因此在点击<option value="">Barcodes</option>时会显示所有库存。到目前为止,当我选择条形码时,它只显示过滤后的数据。

$scope.filter = function(barcode) {
        var filtered = [];
        for(var i = 0; i < $scope.inventories.length; i++){
            if($scope.inventories[i].barcode == barcode){
                filtered.push($scope.inventories[i]);
            } 
        }
        $scope.inventories = filtered;
    };

    <select ng-model="inventory.barcode" ng-change="filter(inventory.barcode)">
        <option value="">Barcodes</option>
        <option ng-repeat="inventory in inventories" value="{{inventory.barcode}}">{{inventory.barcode}}</div>
    </select>

2 个答案:

答案 0 :(得分:0)

您可以使用ng-repeat

直接在filter内进行过滤
$scope.barcode = "";
$scope.conditionalFilter = function(item){
  if ($scope.barcode !== "") {
    return item.barcode === $scope.barcode; // return items only if barcode is selected
  } else {
    return true; // return all items
  } 
};

您的HTML将更改为

    <select ng-model="barcode">
        <option value="">Barcodes</option>
        <option ng-repeat="inventory in inventories | filter:conditionalFilter" value="{{inventory.barcode}}">{{inventory.barcode}}</option>
    </select>

但实际上你不应该使用ng-model

来改变你自己元素的价值

答案 1 :(得分:0)

我不确定你想要实现的目标。但请查看angularjs filter,它将为您过滤。 建议使用ng-options而不是使用ng-repeat。

我使用过滤器和ng-options创建了一个样本fiddle

<div ng-repeat="inventory in inventories| filter : barcode track by $index">
    {{inventory.barcode}}
</div>

您可以在ng-options中使用“track by”获取库存选项“value”中的库存代码

<option value=""></option>

<select ng-model="barcode" ng-options="inventory.barcode for inventory in inventories track by inventory.barcode">
    <option value="">Barcodes</option>       
</select>