Como você pode detectar quando a renderização HTML é concluída no AngularJS

Eu fiz uma extensa pesquisa sobre esse assunto, mas não importa o que eu faça, acho extremamente difícil alcançar esse objetivo.

Quero executar o código quando todos os elementos tiverem sido totalmente renderizados no aplicativo da web AngularJS. Acho que encontrei uma solução sugerindo o uso de roteadores e visualizações, mas não consegui fazer isso funcionar no meu caso, pois parece que requer certa configuração.

Quando voce temng-repeat e muito aninhadodirectives que gerará HTML / conteúdo com base em várias condições usandong-if, Notei que a renderização em HTML continua mesmo depois que o evento pronto para o documento é acionado ou o conteúdo da exibição é carregado.$viewContentLoaded evento é acionado.

A ideia mais próxima que tenho é usar$watch ao longo do comprimento dos filhos do elemento de um dadodirective. Toda vez que o$watch é executado, contador de incrementorenderCount. Em outro evento do timer, verifique se o contadorrenderCount não mudaram nos últimos três ou três segundos, podemos supor que a renderização seja feita.

O código para observar as crianças e verificar se não há mais renderização pode ser o seguinte:

app.directive('whenRenderingDone',  function($interval, $parse){
    return {
        link: function (scope, el, attrs) {
            var renderingCount = 0;
            function watchForChildren() {
                scope.$watch(function(){
                    return $(':input', el).length;
                }, function(newVal, oldVal){
                    if (newVal) {
                        renderingCount++;
                    }
                })
            }
            watchForChildren();
            //Check counter every 3 seconds, if no change since last time, this means rendering is done.
            var checkRenderingDone = $interval(function(){
                var lastCount = lastCount || -1;
                if (lastCount === renderingCount) {
                    var func = $parse(attrs.whenRenderingDone);
                    $interval.cancel(checkRenderingDone);
                    func(scope);
                }
                lastCount = renderingCount || -1;
            }, 3000);
        }
    }
});

Vou tentar implementar a abordagem acima e, se você tiver comentários, entre em contato.

Tarek

questionAnswers(2)

yourAnswerToTheQuestion