angularjs - 由于数据更改，Angular完成更新布局后如何调用函数

Question

我有一个显示链接列表的 ng-repeat 指令。它工作正常，但我的代码也有一个 javascript 函数，它根据列表的尺寸放置列表。自然，在 Angular 完成数据绑定(bind)和修改 DOM 之前，列表的维度是未知的。如果我在数据更改后立即调用该函数，则放置计算会跳枪并将列表放置为空的。我想在 Angular 完成修改 DOM 后触发该函数。我怎样才能做到这一点？

编辑:

刚刚尝试将 ngcloak 作为可能的解决方案，不幸的是它不起作用。阅读ngcloak的文档，我的问题不是列表闪烁，而是像空的一样放置，然后停留在那里。数据绑定(bind)完成后，我需要一种方法来调用我的函数。

Answer 1

除了 ng-repeat 之外，我之前通过创建一个要使用的自定义指令来完成此操作。所以例如

<div ng-repeat="foo in bar" myDirective>

给你的是 myDirective您可以访问指令的范围并检查 ng-repeat 渲染中的最后一项。例如，这就是我在 ng-repeat 渲染的某些元素上使用 isotope jquery 库的原因:

angular
    .module('myModule')
    .directive('myDirective', function ($timeout) {
        return {
            restrict: 'A',
            link: function postLink(scope, element, attrs) {
                if (attrs.ngRepeat && scope.$last) {
                    $timeout(function() {
                        $('#myContainer').isotope({
                           layoutMode: 'fitRows'
                        });
                    });
                }
            }
        };
    });

这与 html 一起使用，例如:

<div id="myContainer" ng-repeat="foo in bar" myDirective>
    <div class="element">{{foo}}</div>
</div>

应该给你你正在寻找的东西。

只需更换 $('#myContainer').isotope({})当 ng-repeat 完成渲染你的重复时你想要执行的内容。