2016-05-13 72 views
0

我有塊帶過濾器:如何激活複選框角度的過濾功能?

<form action=""> 
        <input type="checkbox" id="inp1"> 
        <label for="inp1">All items</label> 
        <input type="checkbox" id="inp2"> 
        <label for="inp2">New today</label> 
        <input type="checkbox" id="inp3"> 
        <label for="inp3">New this week</label> 
        <input type="checkbox" id="inp4"> 
        <label for="inp4">Free delivery</label> 
       </form> 

的 「新今日」 和 「本週新品」 過濾器:

$scope.newThisWeek = function(products){ 
        $scope.time = (Date.now() - Date.parse(products.add_update_time)); 

        if ($scope.time <= 604800000) { 
         return $scope.products; 
        } else { 

         return null; 
        } 

       }; 

       $scope.newToday = function(products){ 
         $scope.time = (Date.now() - Date.parse(products.add_update_time)); 

         if ($scope.time <= 86400000) { 
          return $scope.products; 
         } else { 

          return null; 
         } 
       }; 

使用過濾器,因爲:

<div class="catalog-item" ng-repeat="product in products |filter:newThisWeek|filter:newToday"> 
<a href="{{product.external_url}}" class="item-title">{{ product.name }}</a> 
</div> 

如何激活複選框角度的過濾功能?

回答

1

則需要先綁定在你的HTML到$範圍的輸入,使用NG-模式屬性:

.. 
<input type="checkbox" id="inp2" ng-model="newTodayActivated"> 
<label for="inp2">New today</label> 
..other inputs 

通過這個創建$scope.newTodayActivated屬性,該屬性將被更新(切換真/假)改變複選框狀態。然後,您可以在過濾器表達式函數中使用此值:

$scope.newToday = function(products){  
    //use $scope.newTodayActivated - as Boolean here in your logic 
    if($scope.newTodayActivated) { 
    //do stuff 
    } else { 
    } 
}