选择输入框的过滤器类型

angular.js select filter type of input box

本文关键字：过滤器 类型 输入 选择      更新时间：2023-09-26

我使用angular.js的时间很短，有时我有一种感觉，我对html和javascript一无所知，因为angular的几率在我的想象中应该，而且可能是非常简单的。

这是我的头痛:

电流控制器范围。人员列表是……工厂从后端获取人员。使用ng-repeat可以很好地显示它，使用input:

进行过滤
<input ng-model='query.firstname'> // search by firstname
<input ng-model='query.lastname'> // search by lastname
<ul>
    <li ng-repeat='person in persons | filter: query'> firstname: {{person.firstname}}, lastname: {{person.lastname}}
</ul>

，但我想让它可以选择什么应该是过滤器

类似:

<select> 
    <option value='query.firstname'> by firstname </option>
    <option value='query.lastname'> by lastname </option>

我试图在很多方面搞得一团糟，我很尴尬地显示:)，但我失去了如何连接选择与输入ng-model…

谢谢你的帮助，提前。

您可以尝试这种方法。HTML: 

<select ng-model="filter">
    <option value='firstname'>by firstname </option>
    <option value='lastname'>by lastname </option>
</select>
<input ng-model='query'>
<ul>
    <li ng-repeat='person in persons | filter: getFilter()'> firstname: {{person.firstname}}, lastname: {{person.lastname}}
</ul>

和在控制器中动态构造过滤器表达式:

$scope.getFilter = function() {
    var filter = {};
    filter[$scope.filter] = $scope.query;
    return filter;
};

演示:http://plnkr.co/edit/W5dIMYp3C8p3Yid9iglE?p=preview

相关文章：