Angular NG-Repeat - 内置过滤器不工作

时间:2017-04-20 13:41:59

标签: angularjs

我正在使用Angular 1.5.5开发应用程序。我正在尝试按ID过滤一系列Location对象。 Locations数组中有10个对象。过滤器返回2个对象而不是1个对象:

地点数组: enter image description here

我的html模板如下:

                        <div class="col-md-3" ng-repeat="location in offerings.Locations | filter : {'ID':event.LocationID}">
                        {{location.Name}}<br />
                        {{location.Address}}, {{location.City}}, {{location.State}} {{location.Zip}}<br />
                        Loc ID = {{location.ID}} eventLocID = {{event.LocationID}}
                    </div>

它返回2个结果而不是2 = 2的过滤器:

enter image description here

2 个答案:

答案 0 :(得分:2)

您可以尝试编写自己的过滤功能或使用该结构:

  ng-repeat="location in offerings.Locations | filter : {'ID':event.LocationID} : true"

另请查看此主题Filter array of objects by attribute with integer value in ng-repeat

答案 1 :(得分:1)

<强>样本

var myApp = angular.module('myApp',[]);

myApp.controller('MyCtrl', function($scope) {
    $scope.event = {"LocationID" : 2}
    $scope.locations = [
     {
     "Address": "address1",
     "city": "city1",
     "ID": 2,
     "Name": "name1",
     "State": "state1",
     "Zip": 243435
     },
     {
     "Address": "address2",
     "city": "city2",
     "ID": 3,
     "Name": "name2",
     "State": "state2",
     "Zip": 243435
     },
      {
     "Address": "address3",
     "city": "city3",
     "ID": 12,
     "Name": "name3",
     "State": "state3",
     "Zip": 243435
     }    
    ];
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="MyCtrl">
                    <div class="col-md-3" ng-repeat="location in locations | filter:{'ID' : event.LocationID}:true">
                        {{location.Name}}<br />
                        {{location.Address}}, {{location.City}}, {{location.State}} {{location.Zip}}<br />
                        Loc ID = {{location.ID}} eventLocID = {{event.LocationID}}
                    </div>
</div>