角平面陣列濾波？

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