AngularJS - 在不使用 $timeout 的情况下调用书签布局答案

【问题标题】：AngularJS - Calling wookmark layout without using $timoutAngularJS - 在不使用 $timeout 的情况下调用书签布局
【发布时间】：2013-07-24 09:08:45
【问题描述】：

我目前正在参与一项使用 wookmark 插件和 angularjs 创建类似缩略图的 pinterest 的任务。我可以使用 $timeout 10 秒来显示缩略图，因为服务器需要时间来响应。我想在数据完全加载后调用布局。我已经尝试过承诺但没有运气。

有什么方法可以在不使用 $timeout 的情况下调用 Wookmark 布局？

我的代码如下：

myApp.controller("MyCtrl", ['$scope', '$timeout', 'eventData', function($scope,  $timeout, eventData) {
    function init() {
        $scope.publicstreams = [];
        $scope.publicstreams = eventData.getEvent(0);
        $timeout(initWookmark, 10000);
    }

    function initWookmark() {
        var options = {
            autoResize: true, // This will auto-update the layout when the browser window is resized.
            container: $('#tiles'), // Optional, used for some extra CSS styling
            offset: 5, // Optional, the distance between grid items
            flexibleWidth: 310 // Optional, the maximum width of a grid item
        };
        var handler = $('#tiles li');
        $('#tiles').imagesLoaded(function() {
            // Prepare layout options.
            // Get a reference to your grid items.
            // Call the layout function.
            handler.wookmark(options);
        });
        handler.wookmark(options);
    }
    init();
}]);

任何帮助将不胜感激！

【问题讨论】：

还有另一个选项叫做 angular-deckgrid。看看吧。

标签： javascript angularjs promise pinterest

【解决方案1】：

感谢上帝！

最后我自己弄明白了。我在 $timeout 中将延迟设置为 0 并且它起作用了。

怎么做？

$timeout 实际上是在 DOM 在浏览器中完成渲染后执行的。所以即使是 0 毫秒的延迟也有效。

【讨论】：