angular.js选择滤波器类型的输入框 [英] angular.js select filter type of input box

问题描述

我使用angular.js相当短的时间内，有时我有一种感觉，那我什么都不知道，因为角度的赔率HTML和JavaScript打的事情时在我的想象应该，而且很可能是非常简单的。

I am using angular.js for quite short time, and sometimes i have a feeling, that I know nothing about html and javascript because of angular's odds when hitting things that in my imagination should, and probably ARE very simple.

下面是我的头痛：

我的电流控制器scope.persons是...从后端出厂获得性的人员名单。
它很好地显示了NG-重复，并与输入滤波器：

my currents controller scope.persons is a list of... persons aquired by factory from backend. it shows nicely with ng-repeat, and filters with 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>

但我想有可能从什么应该是过滤器选择。

but i want to make it possible to choose from what should be filter.

是这样的：

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

我试图在混乱了很多办法，其中进出口尴尬，显示:)左右，但即时通讯丢失了怎么用输入NG-型号连接选择...

I tried to mess around in a lot of ways, which Im embarassed to show :), but im lost how to connect select with input ng-model...

感谢您的帮助，在前进。

thanks for help, in advance.

推荐答案

您可以试试这种方法。 HTML：

You can try this approach. 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>

和控制器结构过滤前$ P $动态pssion：

and in controller construct filter expression dynamically:

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

这篇关于angular.js选择滤波器类型的输入框的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！