AngularJS: comment savoir quand la compilation a fini?

Http://plnkr.co/edit/GRVZl35D1cuWz1kzXZfF?p=preview

Dans la fancybox personnalisée (aka lightbox, une boîte de dialogue), je montre le contenu avec des valeurs interpolées.

Dans le service, dans la méthode "open" fancybox, je fais

open: function(html, $scope) { var el = angular.element(html); $compile(el)($scope); // how to know when the $compile is over? $.fancybox.open(el); // the uncompiled is shown before the compiled }

Le problème est que le contenu de la boîte de dialogue est chargé avant la fin de la compilation $, donc, après moins d'une seconde, j'ai rafraîchi le contenu de la boîte de dialogue avec les valeurs.

Le plunkr fonctionne, mais je veux éviter que le "el" s'affiche avant qu'il ne soit totalement compilé: je veux le montrer seulement après que la compilation ait terminé son travail

Y a-t-il un moyen de savoir quand la compilation est terminée afin que je ne montre le contenu sur fancybox qu'après cela?

Vous ne pouvez pas injecter de portée sur les services, il n'y a rien comme une seule valeur de $.

Donc, au lieu de $compile(el)($scope); essayer:

 var compiledEl = $compile(el); ....

La $compile renvoie les données compilées.

Comme note secondaire

Je fournirai un service à la directive et la compile en directive à la place. Je pense que c'est le bon chemin.

J'ai eu le même problème avec les modéles ngDialog et le fournisseur popup. J'avais besoin de positionner la boîte de dialogue en fonction de sa hauteur. Mais la hauteur dépendait du DOM compilé.

J'ai finalement trouvé une solution en utilisant $ timeout, comme décrit dans cette publication: http://blog.brunoscopelliti.com/run-a-directive-after-the-dom-has-finished-rendering/

Pour votre code, cela donnerait quelque chose comme ça:

 open: function(html, $scope) { var el = angular.element(html); $compile(el)($scope); $timeout(function() { $.fancybox.open(el); }, 0); }