我正在编写一个自定义指令,将html select元素绑定到无序列表。
使用静态选择元素可以正常工作。
但是,我无法使用动态选择。有没有办法让我的指令检索由ng-options或ng-repeat指令生成的选项?
我在这里有一个例子:http://jsfiddle.net/fjbyq/3/
angular.module('myApp', [])
.directive('taskFilterChoices', function() {
return {
transclude: true,
replace: true,
template: '<div class="listToggleBox listType" data-ng-transclude><ul class="choicefilterList"><li data-ng-repeat="option in options"> <a href="" class="taskFilterLink" data-value="{{ option.value }}">{{ option.text }}</a> </li> </ul> </div>',
scope: {},
link: function(scope, element, attrs) {
var _select = element.find('select'),
_selectOptions = [];
_select.hide();
_select.find('option').each(function(i, option) {
var _optionObj = {
value: option.value,
text: option.innerText
};
_selectOptions.push(_optionObj);
});
scope.options = _selectOptions;
}
};
})
.directive('taskFilterLink', function() {
return {
restrict: 'C',
link: function(scope, element) {
$(element).on('click', function(e){
e.preventDefault();
var _select = $(this).closest('.listToggleBox').find('select');
_select.val($(this).data('value')).triggerHandler('change');
});
}
};
});
由于