Question

我无法让特定的Angularjs过滤设置工作，包括文本输入，ng-repeat和select，并且喜欢任何帮助任何人可以提供。

我有一组像这样的对象：

[{ id: '1', firstName: 'Charles', lastName: 'Charlston' }, ...]

我正在通过文本输入过滤数组：

<input ng-model="searchText" />

<div ng-repeat="person in people | filter : searchText" ...

目前，这会将“任意”属性值的人物对象数组排序，并且工作正常。

我想要实现的是能够根据所选的<input ng-model="searchText" />更改我的<option id="1" label="lastName" selected>Last Name</option>过滤人员数组的属性。

我的选择如下：

<select class="filterSelect"
        ng-model="selectedPropertyOption"
        ng-options="prop.name for prop in peopleProperties"></select>

peopleProperties看起来像这样：

$scope.peopleProperties = [{id: "1", name: "firstName"}, ...];

所以不要在输入中键入：“charles”并获得与属性id，fistName或lastName匹配的结果，而是需要从select中选择一个选项，其中选项是属性名称，如“firstName” ，我想过滤。然后，输入中输入的内容只会根据选择的选项过滤对象。

我希望这足够了！任何指导都将非常感谢，提前谢谢你！

Answer 1

这是其中一个不方便，有点＆＃34;脏＆＃34; （尽管可能）仅在视图中指定过滤器。

我们需要的是一个可以采用以下形式的过滤器对象：

$scope.filter = { firstName: "foo" };

// or
$scope.filter = { lastName: "foo" };

// or - to reset the "filterBy" property
$scope.filter = { $: "foo" }; // or just "foo"

这在表达式中不容易做，所以在控制器中做得更好：

$scope.filter = {$: undefined}; // initial non-filtering value

$scope.setFilter = function(){
  $scope.filter = {};
  $scope.filter[$scope.selectedPropertyOption || '$'] = $scope.searchText;
};

然后，在setFilter的{{1}}的每次更改时调用searchText函数：

selectedPropertyOption

<强> Demo

AngularJS通过文本输入过滤对象数组，具体取决于所选的选项

1 个答案: