javascript - 带有 jquery 多选插件的 Angular js

Question

我正在使用一个 jQuery 插件，它可以将普通的选择下拉列表转换为精美的多选下拉列表。这是插件网址: http://wenzhixin.net.cn/p/multiple-select/

现在，我现在面临的问题是，我正在使用 angular js 来绑定(bind)下拉值。而且，我将 Angular js 指令用作

app.directive('ccMultipleSelect', function () {
    var directive = {
        link: link,
        restrict: 'A'
    };
    return directive;

    function link(scope, element, attrs) {
        element.multipleSelect({ selectAll: false });
    }
});

在我的 html View 代码如下:

<select data-ng-options="c.key as c.value for c in vm.units" 
    multiple="multiple" data-cc-multiple-select>
</select>

但是，问题是，当指令事件被调用时，即调用 multipleSelect 插件的地方，到那时 angular js 没有完成它的绑定(bind)，因此花哨的下拉列表不包含任何元素。我认为一个快速的解决方案是使用 setTimeout 函数在 500ms 之后调用插件，但这不是一个理想的解决方案。必须有一些其他方式我们可以通过它来观察下拉元素并进一步刷新元素。

Answer 1

选项 1:您是否尝试过没有任何延迟的超时。我与其他人有类似的问题:不加载动态数据的 jquery 插件。

选项 2:重绘多选 $('select').multipleSelect();