AngularJS : exécuter une fonction jQuery à la fin du rendu
Bonjour les amis,
j'ai mis en place un select jQuery.
le but étant exécuter cette commande jQuery :
Code:
1 2
|
$('*.select-cart').select2(); |
afin que tous les select soit redesigné par cette fontion jQuery.
il faut donc que le rendu de la page soit terminé et ensuite executer la commande jQuery.
seulement en AngularJs j'ai des soucis.
j'ai vu qu'on pouvait faire appel à une directive... voici les codes sources.
app.js
Code:
1 2 3 4 5 6 7 8
|
starter.directive('emitLastRepeaterElement', function() {
return function(scope) {
if (scope.$last){
scope.$emit('LastRepeaterElement');
}
};
}); |
products.html
Code:
1 2 3 4 5 6 7 8 9 10 11 12
|
<div ng-repeat="product in ctrl.products emit-last-repeater-element>
<a class="list-group-item" href="#/detail/{{product.id}}">
<div class="row">
...
...
<div class="col-md-12">
<ngcart-addtocart id="{{ product.id }}" name="{{ product.nom }}" price="{{ product.prix }}" quantity="1" quantity-max="30" data="product"></ngcart-addtocart>
</div>
</div>
</a>
</div> |
productCtrl.js
Code:
1 2 3 4 5
|
$scope.$on('LastRepeaterElement', function(){
$('*.select-cart').select2();
console.log("ok enter!");
}); |
"ok enter!" s'affiche bien dans la console -> mais les select ne sont pas pris en charge.
pour tester, j’exécute : $('*.select-cart').select2(); dans la console firebug et les select se redessine bien, c'est ok !
une idée ?