カスタム select コントロール ディレクティブの 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>
私の質問は次のとおりです。
1 つまたは複数のフィルターがある場合、それらをこのディレクティブにどのように組み込むことができますか? ディレクティブの ng-options を変更してフィルターを含めるさまざまな方法を試しましたが、すべて役に立ちませんでした。何か案は？
実装したい2つのフィルターは次のとおりです。
| | filterByType: 'フロント' | orderBy:'名前'"
当然、それらをディレクティブにハードコーディングしたくありません。
説明:
選択値を名前自体でフィルター処理するつもりはありません。むしろ、選択値を (1) 「filterByType」属性値が「Front」の場合にのみ表示し、(2) アルファベット順にフィルター処理することを検討しています。