我看到了一个自定义选择控制指令的 jsfiddle 示例: [http://jsfiddle.net/marco_m_alves/rjbMj/]
myApp.directive('nameValueSelect', function() {
return {
restrict: "E",
scope: {
entry: "=",
field: "@",
options: "=",
onInputChange: "&"
},
controller: function($scope) {
$scope.onChange = function() {
console.log("selected changed");
$scope.entry.type = $scope.option.value;
$scope.onInputChange();
};
var getItemForValue = function(value) {
var item = null;
$scope.options.forEach(function(_option) {
if (_option.value == value) {
item = _option;
}
});
return item;
};
$scope.$watch("entry", function() {
console.log("entry changed");
$scope.option = getItemForValue($scope.entry[$scope.field]);
}, true);
},
template: '<select ng-model="option" ng-options="o.name for o in options" ng-change="onChange()">'
};});
以及相应的 HTML:
<name-value-select entry="entry" field="type" options="types" on-input-change="onInputChange()"></name-value-select>
我的问题是:
如果我有一个或多个过滤器,我将如何将它们用于该指令?我尝试了各种方法来修改指令中的 ng-options 以包含过滤器,但都无济于事。有任何想法吗?
这是我想实现的两个过滤器:
| filterByType: '前面' | orderBy:'名称'"
自然,我不希望它们硬编码到指令中。
澄清:
我不希望按名称过滤选择值,而是希望显示选择值 (1),仅当它们具有“Front”的“filterByType”属性值,然后 (2) 按字母顺序过滤它们。