2

我正在编写一个自定义指令来将一个 html 选择元素绑定到一个无序列表。

它适用于静态选择元素。

但是,我无法使其与动态选择一起使用。有没有办法让我的指令检索由 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');
        });
      }
  };
});

谢谢

4

0 回答 0