呼叫jQuery插件的指令后才数据渲染器的DOM [英] Call jquery plugin in directive only after data is renderer in DOM

问题描述

我想在一个角指令，但只有业务数据返回，并首次呈现在DOM后，初始化一个jQuery插件。
我似乎可以找出如何在角指令做到这一点。
我有这个code，到目前为止，但似乎我打电话插件服务数据到达后，但在此之前它是在DOM渲染...
任何提示？

I want to initialize a jquery plugin in an angular directive but only after the service data is returned and first renderer in the DOM. I can seem to figure out how to do this in angular directive. I have this code so far, but it seems that i am calling the plugin after the service data arrived, but before it is renderer on the DOM... Any hints?

myApp.directive('myDirective', function () {
return {
    restrict: 'A',
    link: function ($scope, element, attrs) {
        $scope.$watch("data.length", function( newValue, oldValue ) {
            if ( newValue === oldValue ) {
                console.log( "Should return..." );
                return; 
            }
            $(element).elastislide();
        });
    }
};

}）;

===编辑====
如果我使用setTimeout函数它工作推迟执行，这是做到这一点的正确方法？

=== EDIT ==== If i postpone the execution using the setTimeout function it works, is this the right way to do this?

    myApp.directive('myDirective', function () {
return {
    restrict: 'A',
    link: function ($scope, element, attrs) {
        $scope.$watch("data.length", function( newValue, oldValue ) {
            if ( newValue === oldValue ) {
                console.log( "Should return..." );
                return; 
            }
            postpone = $timeout(function() {
                  $('#carousel').elastislide();                 
            }, 100);

        });
    }
};

}）;

推荐答案

如果你需要的DOM为渲染第一，使用的 $超时。

If you need the DOM to render first, use $timeout.

如果你只需要DOM进行更新（但不呈现还），使用的 $ evalAsync 。第一次尝试这一个，因为它可能prevent闪烁。

If you only need the DOM to be updated (but not rendered yet), use $evalAsync. Try this one first, as it may prevent flicker.

这篇关于呼叫jQuery插件的指令后才数据渲染器的DOM的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！