如何设置自定义对象属性以在 Angular typeahead 中过滤？答案

【问题标题】：How to set custom object property to filter against in Angular typeahead?如何设置自定义对象属性以在 Angular typeahead 中过滤？
【发布时间】：2016-02-02 16:24:46
【问题描述】：

我正在尝试实现一个通用的 typeahead 指令。它需要一个选项列表和一个配置对象作为属性。配置对象的属性之一是“标签”——向用户显示什么以及如何过滤用户的查询。但是，我无法在过滤器表达式中使用此属性，例如：

 uib-typeahead="option as option[config.label] for option in options | filter:{ config[label] :$viewValue }

尝试执行此操作时出现以下错误：

Syntax Error: Token '[' is unexpected, expecting [:] at column 26 of the expression [options | filter:{ config[label] :$viewValue }] starting at [[label] :$viewValue }].

请帮忙！

【问题讨论】：

标签： javascript angularjs angularjs-directive angularjs-filter angular-ui-typeahead

【解决方案1】：

ngOptions 想要接受一个对象作为过滤器。使用下面的语句，您正在尝试创建并传递一个动态键控对象，该对象无法内联完成它当前的设置方式，它是无效的 Javscript 语法：

... filter:{ config[label] :$viewValue }

解决此问题的一种方法是在控制器中构造对象，然后将其传递给过滤器，注意我是按名称引用动态过滤器的值，而不是 $viewValue：

// controller
$scope.filterByObj[$scope.config['label']] = $scope.selectedFilter;

// template
... filter: filterByObj

我整理了一个描述这个想法的例子：http://plnkr.co/edit/7gffq3mEtFqrfAP4shrj?p=preview

【讨论】：