Question

我做错了，因为我无法达到我需要的结果。

我的JSON数据看起来像这样

[{
type_id: 1, 
brand_id: 0,
name: 'Title',
description: 'Description',
img: 'url'
},...]

所以我需要按type_id和brand_id过滤数据它不是一个复杂的任务，但是很多，我会感谢你的任何帮助，我现在无法处理它。

这就是我的观点。我有两个由ng-repeat生成的过滤器和设备的ng-repeat我需要按类型和品牌过滤器进行过滤。

// filter 1
<div class="filters">
   <h3 class="filters__title">Choose by type</h3>
   <div class="swiper-container">
      <div class="swiper-arrow-prev"></div>
      <div class="swiper-arrow-next"></div>
      <div class="swiper-overflow">
         <div class="swiper-wrapper filter" data-id="type">
            <div class="swiper-slide filter__checkbox" ng-repeat="item in types">
               <input type="checkbox" name="{{item.id}}" id="filter-{{item.id}}" ng-model="item.id" ng-checked="item.id">
               <label for="filter-{{item.id}}">
               <span>{{item.type}}</span>
               </label>
            </div>
            <!-- /item -->
         </div>
         <!-- /filter -->
      </div>
   </div>
</div>
<!-- /filters -->

// filter 2
<div class="filters">
   <h3 class="filters__title">Choose by brand</h3>
   <div class="swiper-container">
      <div class="swiper-arrow-prev"></div>
      <div class="swiper-arrow-next"></div>
      <div class="swiper-overflow">
         <div class="swiper-wrapper filter" data-id="brands">
            <div class="swiper-slide filter__checkbox" ng-repeat="brand in brands">
               <input type="checkbox" name="{{brand.id}}" id="brand-{{brand.id}}" ng-model="brand.id">
               <label for="brand-{{brand.id}}">
               <img ng-src="{{brand.img}}" alt="">
               <span>{{brand.name}}</span>
               </label>
            </div>
            <!-- /item -->
         </div>
         <!-- /filter -->
      </div>
      <!-- /swiper-overflow -->
   </div>
   <!-- /swiper-container -->
</div>
<!-- /filters -->


<div class="card" ng-repeat="device in devices">
   <div class="card__wrap">
      <figure>
         <img ng-src="{{device.img}}" alt="">
      </figure>
      <!-- /img -->
      <h3 class="card__title">{{device.model}}</h3>
   </div>
</div>
<!-- /card -->


angular.module('app', []).controller('mainCtrl', ['$scope', 'dataJSON', '_', function($scope, dataJSON, _) {
            $scope.filterContainer = [];

            // get Data
            dataJSON.getPromise().then(function(data) {
                $scope.brands = data.brands;
                $scope.devices = data.devices;
                $scope.types = data.device_types;

                return data.devices;
            }).then(function(data) {

            })
        }])

Answer 1

您可以使用以下代码进行过滤

// let take two input 
<input ng-model="type_id_model"><input ng-model="brand_id_model">


// filter 1
    ng-repeat="item in types | filter:{type_id : type_id_model}"
// filter 2
    ng-repeat="brand in brands | filter:{brand_id : brand_id_model}"

角度过滤器，在单独的过滤器中有多个复选框

1 个答案: