Question

我试图在我的控制器中使用$filter过滤特定字段，该控制器位于$ watch函数中，但我似乎无法理解官方文档。

案例： 我有一个下拉列表，我用作过滤器参数。我想过滤数组$scope.images中的特定字段。该字段称为Vessel。当在下拉列表中选择一个选项时，$watch函数应该过滤数组。

我现在拥有的代码可以过滤所有字段而不是特定字段。

Angular Code：

$scope.$watch('search', function(val)
{ 
    $scope.images = $filter('filter')($scope.items2, val);
}

查看

<div ng-app="masterApp" ng-controller="listCtrl">
 <div class="container">  
    <label for="singleSelect"> Select Vessel: </label><br>

    <select name="singleSelect" ng-model="search">
        <option value="African Chaser">African Chaser</option>
        <option value="African Sprinter">African Sprinter</option>
    </select>

    <h3 class="text-center">Time: {{images[slider.value].Created | date:'medium'}}</h3>

    <img src="https://intra.monjasa.com/{{images[slider.value].File.ServerRelativeUrl}}" class="feed_image">

    <rzslider rz-slider-model="slider.value" rz-slider-options="slider.options"></rzslider>
 </div>
</div>

我尝试了什么：

    $scope.$watch('search', function(val)
{ 
    $scope.images = $filter('filter: Vessel')($scope.items2, val);
}

上述方法无效。

对我出错的地方有任何建议吗？

Answer 1

希望这会对你有帮助 -

 $scope.images = $filter('filter')($scope.items2,{Vessel : $scope.search},true);

Answer 2

试试这个 -

在您的下拉列表中附加ng-changed事件 -

<select name="singleSelect" ng-model="search" ng-changed="filterItems()">
        <option value="African Chaser">African Chaser</option>
        <option value="African Sprinter">African Sprinter</option>
    </select>

在你的控制器中定义一个像这样的函数filterItems

$scope.filterItems = function(){
   // Filter code here
   $scope.images = $filter('filter')($scope.items2,{"vessel" : $scope.search});
}

容器是您要过滤的$ scope.items2中的属性。

希望它对你有所帮助。

单个字段上的Angular $过滤器

2 个答案: