Bonjour,

Je developpe ma première application avec angularJS.
Meme si je pense que le problème est purement javascript.

L'idée est de créer une grille et de venir y placer des images dans les cellules.

1 - Création de la grille :

 <div ng-repeat="row in rows ">
    <div ng-repeat="col in cols ">
        <div id="grid-{{row}}-{{col}}"><div>
        </div>
     </div>
   </div>

rien de bien compliqué, un double ngRepeat pour construire ligne et colonne.
Chaque div à un id => "grid-1-1" , "grid-1-2"

la grille peut changer de format, c'est à dire je peux afficher un grille de 10x10, 10x20, etc .Quand la grille change de format j'efface la grid dans le DOM et en créé une nouvelle,
d'ailleur quand la grille est de 30x30 c'est lourd à charger .... ( pas de css ou autre )

2 - Chargement des images sur la grille

un json me retourne un tableau ex:

'i15-3-7' => array(
        'element' => 'i-3-7',
        'img' => monimage.jpg',
        'xy' => '3-7',
        'x' => '3',
        'y' => '7',
    ),

donc je viens placer mon image dans la div id=grid-3-7

3 - mon script final :

 $rootScope.ModifyGrid(100)  => je souhaite afficher une grille de 100x100
 $rootScope.ModifyBlockByImg(jsonSave) => je remplace mes images ;

Le problème c'est 1 fois sur deux,il arrive à me placer les éléments sur la grille
quand il y arrive pas je remarque que les ids de mes blocs ne sont pas encore genéré et donc il ne le trouve pas et donc ne le remplace pas.

J'ai l'impression que la function ModifyGrid() n'a pas encore fini de modifier le DOM HTML que la function ModifyBlockByImg commence à travailler.

Avez-vous une idée ?

Comment savoir que le ng-repeat à fini de boucler et balancer mon callback ?

J'espère avoir été claire...

Aucune réponse