过滤显示和隐藏工资

时间:2015-08-12 11:23:58

标签: angularjs

你能帮我解决这个问题(我从这个框架开始)我想过滤薪水(< 1000,[1000,2000],< 3000)我想过滤自然类型(mixte,freelance, contractuel)。我的计划

plunker

自由职业者的过滤器不起作用的问题,你可以帮助我过滤工资......谢谢你很多

 <body data-ng-controller="TestController">
        <table id="missions" border="5">
            <tr>
                <th>mission title</th>
                <th>mission salary</th>
                <th>mission domaine name</th>
                <th>mission Nature</th>
            </tr>
            <tr data-ng-repeat="mission in missions | filter:type1 | filter:type2 | filter:type3">
                <td>{{mission.title}}</td>
                <td>{{mission.salary}}</td>
                <td>{{mission.domain.name}}</td>
                <td>{{mission.missionNature.nature}}</td>
            </tr>
        </table>
        <br/>
        <h4>Filters</h4>
        type de contrat:<br>
        <input type="checkbox" data-ng-model='type1' data-ng-true-value='contractuel' data-ng-false-value='' /> contractuel
        <input type="checkbox" data-ng-model='type2' data-ng-true-value='mixte' data-ng-false-value='' /> mixte
        <input type="checkbox" data-ng-model='type3' data-ng-true-value='freelance' data-ng-false-value=''/> freelance
         <br>
         salary :<br>
        <input type="checkbox" data-ng-model='' data-ng-true-value='' data-ng-false-value='' /> < 1000 
        <input type="checkbox" data-ng-model='' data-ng-true-value='' data-ng-false-value='' /> between 1000 and 2000
        <input type="checkbox" data-ng-model='' data-ng-true-value='' data-ng-false-value='' /> between 2000 and 3000
        <input type="checkbox" data-ng-model='' data-ng-true-value='' data-ng-false-value='' /> >3000
    </body>

1 个答案:

答案 0 :(得分:1)

filter检查是否在整个JSON项中找到给定的字符串。您必须指定要应用过滤器的自定义属性。

由于每个文档中都有freelance字符串,因此过滤器将返回所有文档。您必须通过指定字段进行过滤。

您应该编写自定义过滤器

  $scope.nature=function(item){
    if(!$scope.type1 && !$scope.type2 && !$scope.type3 ){
      return item; //if nothing is checked
    }
    else if($scope.type1===item.missionNature.nature ||$scope.type2===item.missionNature.nature ||$scope.type3===item.missionNature.nature){
      return item;
    }
  };

  $scope.salary = function(item){
    if(!$scope.salary1 && !$scope.salary2 && !$scope.salary3 &&!$scope.salary4 )
      return item; //if nothing is checked
    if($scope.salary1 && item.salary<1000)
      return item;
    if($scope.salary2 && item.salary>=1000 && item.salary<2000)
      return item;
    if($scope.salary3 && item.salary>=2000 && item.salary<3000)
      return item;
    if($scope.salary4 && item.salary>=3000)
      return item;
  }

工作plunker