1

我发现这篇关于设计自定义选择框的很酷的文章。我决定将 jquery 函数包装在一个指令中:

angular.module('App')
  .directive('customSelect', function () {
    return {
      template: '<span class="select-wrapper">' +
          '<div ng-transclude></div>' +
          '</span>' +
        '<span class="holder"></span>',
      transclude: true,
      restrict: 'A',
      priority: 1000,
      link: function postLink(scope, element, attrs) {
          //pass
      }
    };
  });

html:

<div class="col-lg-12 left">
    <select custom-select ng-options="productGroups.indexOf(product) + '' as product.name for product in productGroups" ng-model="userData.pg"></select>
</div>

但由于某些原因,它什么也没做

发现了这个github 问题,它谈到了相同的主题,但在这里并没有真正解决我的问题。

4

1 回答 1

1

您是否需要在同一个元素中包含 select 和 ng-options?我猜 ng-options 设置为 'terminal: true' 很像 ng-repeat。尝试将选项嵌套在单独的 div 中。

我想我是说 ngOptions 指令定义中可能有一些东西导致您的自定义选择出现问题,所以要么尝试在 angular.js 中调试它,要么编写自定义选项指令。如果您在指令定义中将数组传递给编译函数,您可能会循环遍历在一段“选项”html 中复制的数组。这类似于 ngRepeat 的工作方式。

于 2014-09-11T15:40:42.467 回答