角平面阵列滤波？

Question

我试图对平面数组使用多个“标签”来过滤数据，但没有成功。 这是我一直在尝试做的...

  $scope.activeFacets = { elementFacets: ["link"], containerFacets: ["section", "siderail"] } $scope.data[{ "name": "Article Summary Large", "partialName": "article-summary-large", "isAngular": true, "maxColumns": 4, "relatedComponents": { "elements": [ "promo-image", "link", "button" ], "containers": [ "section-box-right-extra", "section-mixed" ], "purpose": [ "styling-content", "promotion" ] } }, { "name": "Article Summary Small", "partialName": "article-summary-small", "relatedComponents": { "elements": [ "thumbnail-image", "link" ] } }, { "name": "Promo Thumb Medium", "partialName": "promo-thumb-medium", "isAngular": true, "relatedComponents": { "elements": [ "promo-image", "link" ] } }] 

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <div ng-app=""> <ul> <li ng-click="activeFacets.elementFacets.push('link')"/>Link</li> <li ng-click="activeFacets.elementFacets.push('button')" />Button</li> </ul> <div ng-repeat="item in data | orderBy:'name' | filter:{relatedComponents.elements : activeFacets.elementFacets}"> {{ item.name }} <ul> <li ng-repeat="comp in relatedComponents.elements"> {{ comp }}</li> </ul> </div> </div> 

我的问题是，如何更改范围以使其起作用，或者如何事先过滤数据？

Answer 1

@Scott，您的解决方案有效，但是随着模型的增长，我可能需要更具体地定位元素。 我让它在一个丑陋的程序类型函数中工作。

 $scope.updateFilter = function(){ $scope.filteredData = $scope.componentData; var filteredElements = []; var filteredContainers = []; if($scope.activeFacets.elementFacets.length > 0 || $scope.activeFacets.containerFacets.length > 0){ $scope.filteredData = []; } if ($scope.activeFacets.elementFacets.length > 0) { for (var j = 0; j < $scope.componentData.length; j++) { for (var i = 0; i < $scope.activeFacets.elementFacets.length; i++) { if ($.inArray($scope.activeFacets.elementFacets[i], $scope.componentData[j].relatedElements) !== -1) { filteredElements.push($scope.componentData[j]); } } } } angular.extend($scope.filteredData, filteredElements); if ($scope.activeFacets.containerFacets.length > 0) { for (var j = 0; j < $scope.componentData.length; j++) { for (var i = 0; i < $scope.activeFacets.containerFacets.length; i++) { if ($.inArray($scope.activeFacets.containerFacets[i], $scope.componentData[j].relatedContainers) !== -1) { if ($.inArray($scope.componentData[j], $scope.filteredData) === -1) { filteredContainers.push($scope.componentData[j]); } } } } } angular.extend($scope.filteredData, filteredContainers); } $scope.$watch('activeFacets', function () { $scope.updateFilter(); }, true);