Angularjs 使用 jquery ui 手风琴 - 时间问题

Question

我想在 AngularJS 中使用 Jquery UI 的手风琴。 所以我写了一个指令：

angular.module('accordion', [])
    .directive('accordion', function () {
        return {
            restrict: 'AE',
            replace: true,
            link: function (scope, element, attrs) {
                $(document).ready(function () {
                    setTimeout(function () {
                        element.accordion({ icons: false });
                    }, 1000);
                });
            }
        };
    });

我使用 setTimeout 是因为指令是在页面之前加载的（或者是吗？我不确定），所以我需要超时才能加载它。 当然，超时并不总是足够的，有时它太快了，所以我可以在指令生效之前看到 HTML，然后它变成手风琴，我不希望用户看到它。

想法？

Answer 1

解决了... 在指令中添加了一个监视 - 监视一个在从服务器接收数据时发生变化的变量 - 并且手风琴被激活！

angular.module('accordion', [])
    .directive('accordion', function () {
        return {
            restrict: 'AE',
            replace: true,
            link: function (scope, element, attrs) {
                scope.$watch('serverData', function (newValue, oldValue) {
                    if (oldValue != newValue) {
                        element.accordion();
                    }
                });
            }
        };
    });

Answer 2

你不需要 ($document).ready 因为指令是在角度引导过程之后链接的，这本身发生在文档准备好之后。

现在我不确定你在使用手风琴是什么，如果它的图像很重，或者使用其他模板，那么这个指令很可能会在所有图像和 ng-includes 加载之前被链接。

你能用一个例子来创建 plunker 吗？