Bonjour les amis,


j'ai mis en place un select jQuery.
le but étant exécuter cette commande jQuery :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
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 : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
starter.directive('emitLastRepeaterElement', function() {
    return function(scope) {
        if (scope.$last){
            scope.$emit('LastRepeaterElement');
        }
    };
});
products.html
Code : Sélectionner tout - Visualiser dans une fenêtre à part
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 : Sélectionner tout - Visualiser dans une fenêtre à part
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 ?