Angularjs指令依赖于另一个

时间:2013-10-28 11:30:59

标签: angularjs angularjs-directive

我正在编写一个自定义指令,将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');
        });
      }
  };
});

由于

0 个答案:

没有答案