angularjs中的多个过滤器

angularjs中的多个过滤器,angularjs,filtering,Angularjs,Filtering,在过去的9个小时里,我一直在试图弄明白这一点,我读了很多问题,以及有角度的文档,但我还没有找到解决方案 文本字段工作正常,选择字段仅显示其中一个,并且按字母顺序排列。。。。怎么会 当我在选择字段中选择某个内容时,表中的所有内容都将被删除。我必须重新加载页面才能取回这些项目 如果我选择“宜家”,如何使其仅显示与宜家公司相关的项目? 我想避免硬编码的过滤函数,因为我会在几个地方使用这种类型的多重过滤,我不想每次都使用单独的函数 来自控制器的JSON: [ {"id": "1", "position"

在过去的9个小时里,我一直在试图弄明白这一点,我读了很多问题,以及有角度的文档,但我还没有找到解决方案

文本字段工作正常,选择字段仅显示其中一个,并且按字母顺序排列。。。。怎么会 当我在选择字段中选择某个内容时,表中的所有内容都将被删除。我必须重新加载页面才能取回这些项目

如果我选择“宜家”,如何使其仅显示与宜家公司相关的项目? 我想避免硬编码的过滤函数,因为我会在几个地方使用这种类型的多重过滤,我不想每次都使用单独的函数

来自控制器的JSON:

[
{"id": "1", "position": "Lagerarbetare", "startdate": "06-07-2014", "city": "Kungenskurva", "company": "IKEA"},
{"id": "2", "position": "Webbdesigner", "startdate": "16-06-2014", "city": "Skarpnäck", "company": "Snowpeak"},
{"id": "3", "position": "Kassör", "startdate": "06-07-2014", "city": "Birsta", "company": "IKEA"},
{"id": "4", "position": "Säljare", "startdate": "06-07-2014", "city": "Gunnebo", "company": "Gunnebo"},
{"id": "5", "position": "Säljare", "startdate": "06-07-2014", "city": "Kungenskurva", "company": "Elgiganten"}
]
查看代码:

<input type="text" ng-model="search_position" placeholder="Sök" />
<div class="uk-button uk-form-select" data-uk-form-select>
    <span></span>
    <i class="uk-icon-caret-down"></i>
    <select ng-model="search_company" ng-options="job.company for job in jobs | unique: 'company' | orderBy:'company'">
        <option value="">Välj företag</option>
    </select>
</div>

<table class="uk-table uk-table-striped uk-table-hover">
    <thead>
        <tr>
            <th>Position</th>
            <th>Företag</th>
            <th>Start datum</th>
            <th>Ort</th>

        </tr>
    </thead>
    <tr ng-repeat="job in jobs | filter: { $: search_position} | filter:{ company: search_company }">
        <td class="uk-width-2-5">
            {{job.position}}
        </td>
        <td class="uk-width-1-5">
            {{job.company}}
        </td>
        <td class="uk-width-1-5">
            {{job.startdate}}
        </td>
        <td class="uk-width-1-5">
            {{job.city}}
        </td>
    </tr>
</table>

弗雷塔格
位置
费雷塔格
起始基准
奥特
{{job.position}
{{job.company}
{{job.startdate}
{{job.city}

很抱歉,我不能给你9个小时的时间,但我希望我能帮助你解渴,找到一个可行的解决方案。:)

必须稍微调整一下才能达到你的需要。所选选项的值必须与筛选条件匹配

ng-options="job.company as job.company for job in jobs | unique:'company' | orderBy:'company'"
请注意,在作业中的作业使用as
job.company as job.company

选择默认选项后,还必须观察型号
search\u company
,以便重置过滤器

$scope.$watch('search_company', function(val){
    // Watch to reset the filter
    $scope.search_company = $scope.search_company || undefined;
});

请参阅此完整文件,以见证相同的情况。还要通读参数表中的最后一行,以了解
as
for
在ng选项中的工作原理。

谢谢!我知道我一定错过了一些简单的东西。这是我和angular的第一天,我必须说,尽管我打了9个小时的比赛。。。我很喜欢……:)这是一场一次性的斗争,而不是持续的斗争;)