0

我想构建一个指令，它将下拉（选择）链接到外部 jquery 插件。

这是该指令的 templateUrl 视图的代码：

<select multiple="multiple">
  <option data-ng-repeat="(key,label in opts)"
     value="{{key}}">{{label}}</option>
</select>

这是我的指令的链接功能：

link: function(scope, element, attrs)
   {
       console.log( scope.opts );
       console.log( $(element).html() );
       $(element).chosen(); //call external plugin
   }

这里的问题是，由于某种原因，当link调用该函数时，选择尚未使用 ng-repeat 填充选项。因此，当我调用 jquery 插件时，它会显示一个空下拉列表，即使稍后选择填充了选项。

的输出console.log( scope.opts );正确显示带有选项的对象，而console.log( $(element).html() );仅显示：

<!-- ngRepeat: (key,label) in opts -->

有没有办法在 ng-repeat 填充选择时收到通知，所以我只能调用外部插件？

4

1 回答 1

0

这个问题的解决方案（不知道 dom 何时被 angularJS 更新）是使用$timeout. 但是，使用下拉菜单，ngOptions很难与外部插件集成。因此，我建议任何想要将所选插件或任何其他插件与下拉菜单集成的人，只使用ngRepeat和ngSelected使用普通<option>s而不是ngOptions

于 2013-08-26T20:38:52.883 回答