角滤波

Question

我具有被划分为多个部分，像这样一种形式：

education: {faculty: "", high_school: ""} 
experience: {experience_1: "", experience_2: "", experience_3: ""} 
personalInfo: {id: "", type: "", email: "", password: "", password_new: "", first_name: "", last_name: "",…} 
skills: {skill_1: "", skill_2: ""} 

所有输入都显示与ngRepeat。

<div ng-repeat="(key, val) in user" > 
    <div ng-repeat="(k,v) in val | filter:filterBySection" class="formParameter" > 

     <span class="param_label"> 
      {{k}}: 
     </span> 

    <span e-class="form-control " class="formParameterValue" editable-text="user.{{key}}.{{k}}" e-name="{{k}}">{{v}}</span> 
    </div> 
</div> 

我该如何实现只显示选定部分的过滤器。例如：如果我按教育按钮，然后只显示'faculty'和'高中'

<li ng-repeat="(a,b) in user" ng-click="filterBySection = ?:{{a}}" ng-model="filterBySection"><a href="#">{{doc_param}}</a></li> 

请提供建议。

Answer 1

您可以通过使用按钮设置某个变量来显示不同的div容器，在本例中为“tab”。然后，通过使用ng-show测试“tab”的值，只显示与相应tab值相关的差异。

// Links or buttons 
<a href ng-click="tab = 1"> Description</a> 
<a href ng-click="tab = 2"> Specifications</a> 

// DIVS 
<div class ="panel" ng-show="tab === 1"> 
    <h4>Description</h4> 
    <p>{{product.description}}</p> 
</div> 
<div class ="panel" ng-show="tab === 2"> 
    <h4>Specifications</h4> 
    <p>{{product.specification}}</p> 
</div> 

Answer 2

而不是使用内置的过滤模块，我想创建一个自定义过滤器，它返回一个布尔值，指示项目是否应该被显示或不（使用ng-show）。

继续让您的<li>设置filterBySection模型。

更改div与ng-repeat喜欢的东西：

<div ng-repeat="(k,v) in val" ng-show="k | filterSelection:filterBySection" class="formParameter" > 

那么你angular.module对象上，添加像一个过滤器：

var app = angular.module("app", []); 
app.filter('filterSelection', function ($filter) { 
    return function (input, section) { 
     // insert logic like 
     if (section == 'Education' && (input == 'high_school' || input == 'faculty')) 
     { return true; } 
     // and so on... 
    }; 
});